TinyMCE 粘贴HTML代码,避免style属性被自动清除_html/css_WEB-ITnose
Jun 24, 2016 am 11:43 AM
TinyMCE在粘贴含有style属性的HTML代码时,会自动清除style属性,设置 extended_valid_elements 也只能在Firefox浏览器起作用,Chrome无效。
extended_valid_elements: 'div[style|class|id]'
Chrome下即使设置了 inline_styles: true, schema: 'html5', 也没有用
无奈去看TinyMCE源码,发现如果去掉 plugins 里的 paste 就不会被剔除样式,最终在 plugin/paste/plugin.js 里找到这样一段代码:
function addPreProcessFilter(filterFunc) { editor.on('BeforePastePreProcess', function(e) { e.content = filterFunc(e.content); }); }
登入後複製
估计是在这里过滤的,找到 filterFunc这个函数:
// Sniff browsers and apply fixes since we can't feature detect if (Env.webkit) { addPreProcessFilter(removeWebKitStyles); } if (Env.ie) { addPreProcessFilter(removeExplorerBrElementsAfterBlocks); }
登入後複製
看到这里我震惊了,TinyMCE真的这么狗屎吗?就直接检测了webkit和ie,Firefox被无视了吗?Firefox下的style被保留是因为TinyMCE的开发人员根本没有考虑Firefox浏览器,我还以为是Chrome下出了什么bug,真够狗屎的。
在进去这个 removeWebKitStyles函数里:
// Filter away styles that isn't matching the target node var webKitStyles = editor.settings.paste_webkit_styles; if (editor.settings.paste_remove_styles_if_webkit === false || webKitStyles == "all") { return content; }
登入後複製
很明显,只要设置一下这个属性就可以
paste_webkit_styles: true
看了TinyMCE的源代码,写的真叫一个烂,全局变量没有加任何标识区分本地变量,函数和语句混合在一起。
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱門文章
擊敗分裂小說需要多長時間?
3 週前
By DDD
倉庫:如何復興隊友
3 週前
By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
3 週前
By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
1 週前
By 尊渡假赌尊渡假赌尊渡假赌
公眾號網頁更新緩存難題:如何避免版本更新後舊緩存影響用戶體驗?
3 週前
By 王林

熱門文章
擊敗分裂小說需要多長時間?
3 週前
By DDD
倉庫:如何復興隊友
3 週前
By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
3 週前
By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
1 週前
By 尊渡假赌尊渡假赌尊渡假赌
公眾號網頁更新緩存難題:如何避免版本更新後舊緩存影響用戶體驗?
3 週前
By 王林

熱門文章標籤

記事本++7.3.1
好用且免費的程式碼編輯器

SublimeText3漢化版
中文版,非常好用

禪工作室 13.0.1
強大的PHP整合開發環境

Dreamweaver CS6
視覺化網頁開發工具

SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)

< iframe>的目的是什麼。 標籤?使用時的安全考慮是什麼?

我如何使用html5< meter> 要在範圍內顯示數值數據的元素?
