ckeditor前身fckeditor,是國際上資質(zhì)最老的網(wǎng)頁編輯器,而且一直保留開源免費(fèi)的政策,所以我也一直比較喜歡使用和研究,根據(jù)了解,不管是自動(dòng)生成的代碼質(zhì)量、自由配置度、功能擴(kuò)展性、瀏覽器兼容性方面都是非常好的。
這里方維網(wǎng)絡(luò)就大家經(jīng)常遇到的編輯器
源代碼編輯模式時(shí),很多內(nèi)容標(biāo)簽會(huì)被編輯器自動(dòng)過濾這個(gè)問題做下解釋,其實(shí)ckeditor有個(gè)
allowedContent屬性,可以通過config.js配置,但是默認(rèn)是開啟的,主要功能是規(guī)定編輯內(nèi)容允許的標(biāo)簽、標(biāo)簽的屬性(attributes)、標(biāo)簽的樣式(style)以及可以使用的類(class).如果要禁用內(nèi)容過濾,很簡(jiǎn)單,下面一句話就可以搞定:
在配置config.js文件增加一條配置語句config.allowedContent=true。
但是可能你還會(huì)想深入了解allowedContent是怎么控制過濾功能的,比如如何設(shè)置允許哪些標(biāo)簽,只允許帶哪些屬性的標(biāo)簽、過濾什么標(biāo)簽、過濾什么屬性、過濾什么樣式等。其刪除的規(guī)則很輕大,下面方維網(wǎng)站建設(shè)舉個(gè)配置示例:
CKEDITOR.replace( 'editor2', {
allowedContent:
'h1 h2 h3 p blockquote strong em;' +
'a[!href];' +
'img(left,right)[!src,alt,width,height];' +
'table tr th td caption;' +
'span{!font-family};' +'
'span{!color};' +
'span(!marker);' +
'del ins'
} );
這個(gè)
h1 h2 h3 p blockquote strong em - 編輯器允許這些標(biāo)簽,但是任何屬性都會(huì)被過濾;
a[!href]
- href屬性對(duì)于a是必須的,也就是
如果a沒有href的標(biāo)簽也會(huì)被過濾,而且其他屬性會(huì)被過濾;
img(left,right)[!src,alt,width,height]
- src屬性是img標(biāo)簽必須的
. alt
, width
, height
屬性可以有,但class屬性必須是left或者right
table tr th td caption
- 表示這些標(biāo)簽都是允許的
span{!font-family}
, span{!color}
, span(!marker)
- 表示span只接受包含font-family的style或者包含color的style,還有就是包含class=marker的span
del ins
- 表示以上標(biāo)簽都被接受,其他都會(huì)被過濾。
從這些規(guī)則可以看出,ckeditr過濾是非常強(qiáng)大的,里面的水實(shí)在太深了,歡迎有興趣的程序員一起探討和研究。
如沒特殊注明,文章均為方維網(wǎng)絡(luò)原創(chuàng),轉(zhuǎn)載請(qǐng)注明來自http://m.oulysa.com/news/2309.html