CKEditor的使用经历总结

关于ckeditor的下载和引用网上有很多完整清晰的教程，就不在此多说了，主要说一些小问题。

这个插件，初次用的时候放不进背景图，放不进隐藏域，连class，id这些属性都放不进去，然后我进行了一些调整，就可以支持大部分标签和属性了。

var editor = CKEDITOR.replace('editor1', {

    extraAllowedContent:'span{background,display}'

});

上面的span代表允许span标签，{}中的background和dispaly代表允许span标签使用background和dispaly属性，你可以只设置你需要的。

var editor = CKEDITOR.replace('editor1', {

    extraAllowedContent :'*[*]{*}(*)', // 允许所有html属性包括自定义的

    allowedContent: true, // 允许所有html标签

}

这样设置的话就是允许所有标签和属性，包括自定义的属性，如果你不需要限制，可以直接允许所有，但是即使允许所有属性，input的hide还是不能生效，可能因为它是编辑器吧，设置了hide框还是会直接展示出来。

设置值和获取值：

//这是一个大坑，从ckeditor取出来的值根本找不到换行符，但是把这个值放到js里就有换行了，然后就报错，所以在前端去掉换行

var str = '<?php echo str_replace(PHP_EOL, "" ,$str);?>';

//设置值

CKEDITOR.instances.editor1.setData(str);

//获取ckeditor中的html,带有大部分样式

var textcontent = editor.document.getBody().getHtml(); 

//获取ckdeitor中的值，也是html但是有的样式是获取不到的

var textcontent = CKEDITOR.instances.editor1.getData();

注意上面代码中的editor和editor1，editor1是容器id，editor是var自定义的。

var editor = CKEDITOR.replace('editor1', {

最后，本文所有代码都是在js里写的，应该没人会搞错吧。

巴特西

CKEditor的使用经历总结

最新文章

热门文章