【问题标题】:Stripping styles from TinyMCE copy+paste?从 TinyMCE 复制+粘贴中剥离样式?
【发布时间】:2011-12-14 06:38:37
【问题描述】:

有没有办法通过从外部来源(例如 Word)复制+粘贴来去除特定标签进入微型 MCE?我想防止字体系列和图像标签被复制+粘贴,但字体大小等没有问题。

谢谢!

【问题讨论】:

  • 您的问题使用了一些令人困惑的措辞。如果我理解正确,您想删除特定的内联样式(例如font-family)和标签(例如<img>)。

标签: javascript css tinymce wysiwyg


【解决方案1】:

您无法真正阻止某人粘贴某些内容,因此我相信您最好的选择是通过在表单提交上调用函数或对微小的 MCE 文本区域进行 onchange 来过滤掉不需要的标签。然后你可以使用一些正则表达式替换来摆脱不需要的标签。

编辑:其实有一个简单的方法。检查TinyMCE documentation

【讨论】:

  • 我明白,我想允许复制粘贴我只是想去除复制粘贴的某些元素(来自单词或网站的跨度中的某些标签)。我希望 TinyMCE 能以一种简单的方式支持它。
  • 谢谢!抱歉,我找不到,扫描了文档,但一定错过了。
  • invalid_elementsvalid_stylesinvalid_styles 似乎相关,但似乎不适用于粘贴:/
【解决方案2】:

这是一个类似 SO 问题的链接,其中详细描述了如何去除不需要的标签:TinyMCE Paste As Plain Text

【讨论】:

    【解决方案3】:

    我不知道这会有多大用处,但您可能想看看这个 jQuery 插件,它允许您从粘贴的文本中过滤标签和属性。

    FilteredPaste.js - A jQuery Plugin To Filter & Clean Pasted Input

    【讨论】:

      【解决方案4】:

      虽然“你无法真正阻止某人粘贴某些内容”,但您可以转换您的网络应用插入到 TinyMCE 文本框(或任何其他输入)中的内容。

      1. 监听浏览器原生的paste事件。
      2. DOMParser解析剪贴板的text/html字符串。
      3. 在生成的 DOM 树中进行更改。
      4. 将文本框内容设置为剥离的内容。
      5. 阻止paste 默认操作。

      看看这个:

      editor.on ('paste', event => {
      
        // Get clipboard's original HTML string
        const clipboard = event.clipboardData
        const originalHtml = clipboard.getData ('text/html')
      
        // Parse HTML string into a DOMElement
        const parser = new DOMParser
        const doc = parser.parseFromString (originalHtml, 'text/html')
      
        // Modify DOM tree
        const elems = doc.body.querySelectorAll ('*')
        elems.forEach (elem => {
          elem.style.fontFamily = ''
          // Do other modifications here...
        })
      
        // Set textbox content to modified HTML
        editor.setContent (doc.body.innerHTML)
      
        // Prevent pasting original content
        event.preventDefault ()
      })
      
      

      【讨论】:

        猜你喜欢
        • 2020-09-04
        • 1970-01-01
        • 2012-11-15
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多