web编辑器过滤word文档信息时出现的问题

  昨天帮同事修改一条新闻的内容,使用的是ewebeditor编辑器,发现如果内容全部为英文的时候,粘贴进入编辑器后会自动添加上<font face=Verdana>指定字体样式的代码,⊙﹏⊙b汗。这样就和页面原始指定的字体不一样了。


  后面查看了ewebeditor编辑器的代码,发现ewebeditor在IE下为了过滤word文档粘贴进来的内容,对剪贴板的内容进行了处理,然后判断是否包含word文档的html标记。就是经过这样的处理,导致IE浏览器自动加上那个了字体样式的标签<font face=Verdana>

ewebeditor原来的代码如下

+展开
-JavaScript
// 取剪粘板中的HTML格式数据
function GetClipboardHTML() {
var oDiv = document.getElementById("eWebEditor_Temp_HTML")
oDiv.innerHTML = "";
var oTextRange = document.body.createTextRange();
oTextRange.moveToElementText(oDiv) ;
oTextRange.execCommand("Paste");//就是执行这句后IE给全部为英文的部分自动添加字体Verdana

var sData = oDiv.innerHTML ;
oDiv.innerHTML = "" ;

return sData;
}
// 粘贴时自动检测是否来源于Word格式
eWebEditor.document.body.onpaste = onPaste ;
function onPaste() {
if (sCurrMode=="VIEW"return false;

if (sCurrMode=="EDIT"){
var sHTML = GetClipboardHTML() ;
if (config.AutoDetectPasteFromWord && BrowserInfo.IsIE55OrMore) {
var re = /<\w[^>]* class="?MsoNormal"?/gi ;
if ( re.test(sHTML)){
if ( confirm( "你要粘贴的内容好象是从Word中拷出来的,是否要先清除Word格式再粘贴?" ) ){
cleanAndPaste( sHTML ) ;
return false ;
}
}
}
        eWebEditor.document.selection.createRange().pasteHTML(sHTML);
return false;
}else{
eWebEditor.document.selection.createRange().pasteHTML(HTMLEncode( clipboardData.getData("Text"))) ;
return false;
}

}


  为了和页面样式表指定的样式一致,只好替换掉font标签了,需该后的代码如下
+展开
-JavaScript
// 取剪粘板中的HTML格式数据
function GetClipboardHTML() {
var oDiv = document.getElementById("eWebEditor_Temp_HTML")
oDiv.innerHTML = "";
var oTextRange = document.body.createTextRange();
oTextRange.moveToElementText(oDiv) ;
oTextRange.execCommand("Paste");

var sData = oDiv.innerHTML ;
oDiv.innerHTML = "" ;

   //alert(sData)
sData = sData.replace(/<\/?(font)[^>]*>/ig,'');//===========替换font标签
    //alert(sData)

return sData;
}

  经过修改是可以和页面指定的默认样式一致了。不过有个小问题,如果复制的内容里面包含了font标签,非IE自动生成的,也会替换掉~

加支付宝好友偷能量挖...


原创文章,转载请注明出处:web编辑器过滤word文档信息时出现的问题

评论(0)Web开发网
阅读(253)喜欢(0)JavaScript/Ajax开发技巧