首页 > 技术文章 > UEditor写入源代码后,格式乱掉。少标签,div不见,多空行等等错误!(已解决)

zhanghai 2014-04-30 18:19 原文

百度的UEditor,样式上挺美观的。所以一直都在用他。但是问题真是一把一把的多。在放入html源码后,格式错乱了。div不见了,多空行,table的td错误嵌套等等。这个问题百度也没有好好的想去解决。

好了,废话不多说了,进入正题。

1.首先解决缺少div标签的问题。其实是百度默认把div标签屏蔽了,为了避免多div或少div的情况下,会影响整个页面的布局。这个也情理之中。

解决方式是:

 //模式屏蔽div为false就可以了

editor.options.allowDivTransToP = false;

这个是最简单的。

2.再者解决table的td乱嵌套的问题。

这个不知道是不是百度的一个BUG,在考虑子节点必须拥有父节点的td节点中,竟然没有写进table。

修正方法:在ueditor.all.js中,找到

var uNode = UE.uNode,
needParentNode = {
'td':'tr',

//在这行td的数组中补上 table即可
'tr': ['tbody', 'thead', 'tfoot', 'table'],
'tbody':'table',
'th':'tr',
'thead':'table',
'tfoot':'table',
'caption':'table',
'li':['ul', 'ol'],
'dt':'dl',
'dd':'dl',
'option':'select'
},
needChild = {
'ol':'li',
'ul':'li'
};

3.最后解决在空td的时候会产生<br>从而导致版面措乱。

解决方法:同样在 ueditor.all.js中,找到

case 'caption':
if(!node.children || !node.children.length){
//去除空td中的 <br/>,将后面的生成br的方法修改为UE.uNode.createText(' ')
node.appendChild(browser.ie ? UE.uNode.createText(' ') : UE.uNode.createText(' '))
}
break;

 

4.还有乱七八糟的样式,惹人厌。也去掉

找到

<script type="text/javascript">
document.getElementById('preview').innerHTML = editor.getContent();

//注释掉就可以了

//uParse('#preview', {
// rootPath: '../../',
// chartContainerHeight: 500
//})
dialog.oncancel = function () {
document.getElementById('preview').innerHTML = '';
}
</script>

 

推荐阅读