javascript - HTML5 contenteditable 粘贴特殊样式

Question

我有一个 contenteditable 元素，当我粘贴一些文本时，它会保持格式。
我也可以粘贴没有格式的文本:

<script>
$('#divedit').bind('paste', function(e){
   $('#textarea').focus();
   setTimeout(function(){
         var text = $('#textarea').val();
         $('#textarea').val('');
         $('#divedit').focus();
         document.execCommand('insertHTML', false, text);
         }, 10);
});
</script>

但我想保留除字体系列和颜色之外的格式。
这可能吗？

Answer 1

你可以使用 TreeWalker遍历每个元素节点并删除您不想保存的样式。

如果您出于性能原因只想遍历粘贴的节点，您可以像使用 textarea 那样做一个解决方案，而是使用另一个 contenteditable 元素来捕获粘贴的内容，遍历粘贴后的节点，然后使用 innerHTML 和 insertHTML，或者如果您不想重新创建它们，则将它们从粘贴捕捉器移至编辑器。

您可能还想在当前光标/选择所在的位置放置一些元素，以便在将元素焦点更改为另一个 textarea/contenteditable 时可以恢复它以捕捉粘贴。 Window.getSelection将帮助您解决这个问题。