如何在 ckeditor 初始化后更改加载的样式表

发布于 2024-08-21 10:56:13 字数 279 浏览 7 评论 0原文

是否可以动态更改 ckeditor 实例加载的样式表？

即我有一个具有以下配置的 ckeditor 实例： CKEDITOR.replace('_content', {"resize_enabled":true, "customConfig":"/kmt/js/ckeditor_config.js","contentsCss":"/custom/ckeditorstyle.css","contentWidth":"240" });

不是很复杂。之后我想允许用户动态更改 contentcss 属性......

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

凑诗 2024-08-28 10:56:13

您可以结合这个问题的答案中给出的代码（如何在运行时动态添加样式表）与接受的 回答这个SO问题（如何在JavaScript中访问CKEditor实例的body元素）。

回复收藏 0 原文

余罪 2024-08-28 10:56:13

感谢 Pekka，我通过以下方式实现了解决方案：

$('#stylesheeetSelector').change(function() {
    $.post('/getStylesheet', {id: $(this).val()}, function(data) {
        for(i in CKEDITOR.instances) {
            var linkElement = $(CKEDITOR.instances[i].document.$).find('link');
            if (data.editorStylesheet > 0) {
                if (linkElement.length == 0) {
                    $(CKEDITOR.instances[i].document.$).find('head').append('<link rel="stylesheet" type="text/css" href="'+ data.editorStylesheet +'">');
                } else {
                    linkElement.attr('href', data.editorStylesheet)
                }
            } else if (linkElement.length > 0) {
                linkElement.remove();
            }
        }
    });
});

它的工作原理是获取填充有（以及其他内容）样式表 URL 的 JSON 对象，并设置（或删除，如果不存在）所选样式表...

干净而简单！

Thanx to Pekka, I achieved the solution via:

$('#stylesheeetSelector').change(function() {
    $.post('/getStylesheet', {id: $(this).val()}, function(data) {
        for(i in CKEDITOR.instances) {
            var linkElement = $(CKEDITOR.instances[i].document.$).find('link');
            if (data.editorStylesheet > 0) {
                if (linkElement.length == 0) {
                    $(CKEDITOR.instances[i].document.$).find('head').append('<link rel="stylesheet" type="text/css" href="'+ data.editorStylesheet +'">');
                } else {
                    linkElement.attr('href', data.editorStylesheet)
                }
            } else if (linkElement.length > 0) {
                linkElement.remove();
            }
        }
    });
});

It works by fetching a JSON object filled with (amoungst other things) the stylesheet URL and sets (or removes if none present) the selected stylesheet...

Clean and simple!

回复收藏 0 原文

~没有更多了~