从粘贴的文本中删除背景色所见即所得

Question

我目前正在使用所见即所得的文本编辑器，但在使用一个元素时遇到了一些麻烦。每当我从网站复制和粘贴文本时，它也会粘贴背景颜色。我想要它，以便在粘贴文本时，背景色被删除。

目前我有一个可以编辑的div：

<div id="editor" class="comment-section" contenteditable="true" spellcheck="false" tabindex="0"></div>

然后使用jQuery，我尝试删除div中所有子级的背景色，因为当我粘贴文本时，它会向div中添加跨度：

$('#editor').on('paste', function(e) {
    $(this).children().attr('background-color', 'transparent');
});

但是这似乎将先前粘贴的文本的背景色设置为透明，但实际上并没有删除背景。

Answer 1

类似于此处的第二个解决方案：JavaScript get clipboard data on paste event (Cross browser)

$('#editor').on('paste', function(e) {
    let  pastedData, text;
    // Stop data actually being pasted into div
    e.stopPropagation();
    e.preventDefault();
    // Get pasted data via clipboard API
    pastedData = e.originalEvent.clipboardData || window.clipboardData;
    pastedData = pastedData.getData('Text');
    text = $(this).text();
    console.log(text, pastedData);
    $(this).text(text+pastedData);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="editor" class="comment-section" contenteditable="true" spellcheck="false" tabindex="0"></div>