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

好吧，我不能是唯一一个这个问题似乎永远持续下去的问题。从MS-Word粘贴到任何基于浏览器的HTML编辑器

我们使用基于浏览器的html编辑器（几个不同的编辑器） - 每个人都有自己的“从文字上粘贴”按钮，效果很好。

但是，我们的许多用户只是直接从单词粘贴到设计区域。对我们来说，这会导致世界末日 - 有时它会打破JavaScript或其他不可多得的事情。

因此，我决定编写一个简单的函数来搜索源代码的内容，并且如果它看到任何与微软字粘贴关联的错误字符，则返回“this this match like a 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％的问题，我会欣喜若狂。

谢谢。

来源

2011-05-03 OneNerd

CKEditor已经有了这个检查，也许看看他们的来源，因为它是开放的。 – 2011-05-03 17:03:53

最近我在寻找类似的东西后，谷歌搜索我发现一个很好的功能。它有大部分不好的标签列出。这里是包含该功能的链接：

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

所有学分原作者所有。

来源

2011-05-03 18:54:37 ZeNo

不错的开始。会看到别人说什么，但有一点帮助，所以给了你一个投票。 – OneNerd 2011-05-03 19:10:36

@zeNo适用于Firefox/Chrome，但在IE中添加额外的“<”标签不知道为什么，IE浏览器是否有任何特定的设置/更改？ – Gurvinder 2013-05-13 14:30:27

@zoNO为什么要删除标题H1-H6？ – 2016-11-17 16:28:00

Tinymce在粘贴时有此标志。你可以看看the past_preprocess setting of the paste plugin。

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

paste_preprocess : function(pl, o) { 
    //if(console) console.log('content', o); 

    if (o.wordContent) { 
      alert('paste from WORD detected!!!'); 
    } 
    ... 
},

我使用一个特殊的函数来摆脱不必要的标签（我是不是默认的方式TinyMCE的，开心处理这一点 - 所以我写了我自己）。

来源

2011-05-04 10:06:13 Thariama

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

回答

相关问题