粘贴到contentEditable div时如何保留onclick

Question

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

细节

片段

 <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>

Answer 1

浏览器会为您剥离事件处理程序以防止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();
});

这仅仅是一个概念证明，并有大量的越多，你需要做的，使这项工作可靠地在不同的浏览器。

粘贴到contentEditable div时如何保留onclick

问题描述

细节

片段

1 个解决方案

解决方案1
2 已采纳 2018-05-19 10:32:38

粘贴到contentEditable div时如何保留onclick

问题描述

细节

片段

1 个解决方案

解决方案1 2 已采纳 2018-05-19 10:32:38

解决方案1
2 已采纳 2018-05-19 10:32:38