从MS-Word粘贴到任何基于浏览器的HTML编辑器

Pasting From MS-Word into any Browser-based HTML Editor

本文关键字：浏览器 HTML 编辑器 任何基 MS-Word      更新时间：2023-09-26

好吧，我不可能是唯一一个有这个问题的人，这个问题似乎永远不会结束。

我们使用基于浏览器的html编辑器(几个不同的)-每个都有自己的"粘贴自word"按钮，工作得很好。

然而，我们的许多用户只是直接从word粘贴到设计区域。对我们来说，这会导致世界末日——有时它会破坏javascript或其他太多的东西。

所以，我决定写一个简单的函数来搜索源代码的内容，如果它看到任何与microsoft word粘贴相关的坏字符，就会抛出'这看起来像ms-word粘贴'的匹配。目前，它看起来像这样:

// detect potentially bad characters - usually from msword paste
function hasInvalidChars ( in_element ) {
    var src     = $j(in_element).val();
    var e       = $E(src);  // enhanced string
    var bad     = Array(    "mso-list:", "class='"Mso", "</o:p>", "[if !supportLists]", 
                            "style='"mso-", "mso-bidi", "“", "”", "<v:shapetype", "<v:path", 
                            "file:///" );
    for ( i=0; i< bad.length; i++ ) {
        if ( e.contains(bad[i]) ) {
            return true;
        }
    }
    return false;
}

请注意，如果你尝试运行代码，它不会工作，因为(1)我使用jQuery和(2)我有一个特殊的对象($E)，它添加了一堆东西到一个字符串，一个是'contains()'函数，但你得到的想法，它在做什么。

我要找的是属于'bad[]'数组的数组元素。我已经提出了一个初步的列表(这可能是也可能不是一个好的起点)，但我问你们这些专家-拜托-你能告诉我你会把哪些字符或短语放在这里吗?在这一点上，如果我能抓住80%的问题，我将欣喜若狂。

谢谢。

最近我正在寻找类似的东西，经过一点谷歌搜索，我发现了一个很好的函数。它列出了大多数坏标签。下面是包含该函数的链接:

Javascript函数

<script type="text/javascript" runat="server" language="javascript">
function CleanWordHTML( str )
{
str = str.replace(/<o:p>'s*<'/o:p>/g, "") ;
str = str.replace(/<o:p>.*?<'/o:p>/g, "&nbsp;") ;
str = str.replace( /'s*mso-[^:]+:[^;"]+;?/gi, "" ) ;
str = str.replace( /'s*MARGIN: 0cm 0cm 0pt's*;/gi, "" ) ;
str = str.replace( /'s*MARGIN: 0cm 0cm 0pt's*"/gi, "'"" ) ;
str = str.replace( /'s*TEXT-INDENT: 0cm's*;/gi, "" ) ;
str = str.replace( /'s*TEXT-INDENT: 0cm's*"/gi, "'"" ) ;
str = str.replace( /'s*TEXT-ALIGN: [^'s;]+;?"/gi, "'"" ) ;
str = str.replace( /'s*PAGE-BREAK-BEFORE: [^'s;]+;?"/gi, "'"" ) ;
str = str.replace( /'s*FONT-VARIANT: [^'s;]+;?"/gi, "'"" ) ;
str = str.replace( /'s*tab-stops:[^;"]*;?/gi, "" ) ;
str = str.replace( /'s*tab-stops:[^"]*/gi, "" ) ;
str = str.replace( /'s*face="[^"]*"/gi, "" ) ;
str = str.replace( /'s*face=[^ >]*/gi, "" ) ;
str = str.replace( /'s*FONT-FAMILY:[^;"]*;?/gi, "" ) ;
str = str.replace(/<('w[^>]*) class=([^ |>]*)([^>]*)/gi, "<$1$3") ;
str = str.replace( /<('w[^>]*) style="([^'"]*)"([^>]*)/gi, "<$1$3" ) ;
str = str.replace( /'s*style="'s*"/gi, '' ) ;
str = str.replace( /<SPAN's*[^>]*>'s*&nbsp;'s*<'/SPAN>/gi, '&nbsp;' ) ;
str = str.replace( /<SPAN's*[^>]*><'/SPAN>/gi, '' ) ;
str = str.replace(/<('w[^>]*) lang=([^ |>]*)([^>]*)/gi, "<$1$3") ;
str = str.replace( /<SPAN's*>(.*?)<'/SPAN>/gi, '$1' ) ;
str = str.replace( /<FONT's*>(.*?)<'/FONT>/gi, '$1' ) ;
str = str.replace(/<''?'?xml[^>]*>/gi, "") ;
str = str.replace(/<'/?'w+:[^>]*>/gi, "") ;
str = str.replace( /<H'd>'s*<'/H'd>/gi, '' ) ;
str = str.replace( /<H1([^>]*)>/gi, '' ) ;
str = str.replace( /<H2([^>]*)>/gi, '' ) ;
str = str.replace( /<H3([^>]*)>/gi, '' ) ;
str = str.replace( /<H4([^>]*)>/gi, '' ) ;
str = str.replace( /<H5([^>]*)>/gi, '' ) ;
str = str.replace( /<H6([^>]*)>/gi, '' ) ;
str = str.replace( /<'/H'd>/gi, '<br>' ) ; //remove this to take out breaks where Heading tags were
str = str.replace( /<(U|I|STRIKE)>&nbsp;<'/'1>/g, '&nbsp;' ) ;
str = str.replace( /<(B|b)>&nbsp;<'/'b|B>/g, '' ) ;
str = str.replace( /<([^'s>]+)[^>]*>'s*<'/'1>/g, '' ) ;
str = str.replace( /<([^'s>]+)[^>]*>'s*<'/'1>/g, '' ) ;
str = str.replace( /<([^'s>]+)[^>]*>'s*<'/'1>/g, '' ) ;
//some RegEx code for the picky browsers
var re = new RegExp("(<P)([^>]*>.*?)(<'/P>)","gi") ;
str = str.replace( re, "<div$2</div>" ) ;
var re2 = new RegExp("(<font|<FONT)([^*>]*>.*?)(<'/FONT>|<'/font>)","gi") ;
str = str.replace( re2, "<div$2</div>") ;
str = str.replace( /size|SIZE = (['d]{1})/g, '' ) ;
return str ;
}
</script>
http://www.1stclassmedia.co.uk/developers/clean-ms-word-formatting.php

所有功劳归原作者。

Tinymce在粘贴时有一个标记。

你应该看看粘贴插件的past_preprocess设置。

在这里，您可以使用'o'访问粘贴的内容，并查看粘贴是否来自Word。例子:

paste_preprocess : function(pl, o) {
  //if(console) console.log('content', o);
  if (o.wordContent ) {
           alert('paste from WORD detected!!!');
    }
  ...   
},

我正在使用一个特殊的函数来摆脱不需要的标签(我对tinymce处理这个的默认方式不太满意-所以我自己写了)

相关文章：