粘贴到contentEditable div时如何保留onclick

时间：2018-05-19 09:50:05

标签： javascript html css

我有一个链接和一个contentEditable div。该链接具有onclick属性。当我复制链接并将其粘贴到contentEditable div中时，onclick属性已被删除。无论如何要保留contentEditable中的属性吗？

详细

Description

段

<html>
    <head>
    </head>
    <body>
      <a href="#" onclick="handleClick()">Click me</a>
      <div
          style="border: 1px solid black; min-width: 100px;"
          contenteditable="true">
      </div>
      <script>
        function handleClick() {
          console.log("clicked");
        }
      </script>
    </body>
</html>

1 个答案:

答案 0 :(得分：2)

浏览器会为您阻止事件处理程序以阻止XSS。但是，如果您确定可以在粘贴的HTML中保留有潜在危险的内容，则可以自定义onPaste处理程序：

const editable = document.querySelector('[contenteditable]');
editable.addEventListener('paste', function(event) {
    const dataTransfer = event.clipboardData;
    const html = dataTransfer.getData('text/html');
    document.execCommand('insertHTML', false, html);
    event.preventDefault();
});

这只是一个概念验证，你需要做很多，以便在不同的浏览器中可靠地工作。

相关问题
最新问题