JS粘贴为文本，从contenteditable 中删除格式

最新推荐文章于 2024-03-04 11:09:21 发布

爪蛙没有爪

最新推荐文章于 2024-03-04 11:09:21 发布

阅读量3.3k

点赞数 1

分类专栏： HTML Javascript 文章标签：粘贴为文本 contenteditable去格式粘贴去格式

本文链接：https://blog.csdn.net/qq_32013641/article/details/100575309

版权

Javascript 同时被 2 个专栏收录

14 篇文章 0 订阅

订阅专栏

HTML

5 篇文章 0 订阅

订阅专栏

问题： 使用contenteditable="true"的div元素，使用粘贴功能时会携带复制文本的样式，造成样式的错乱。在某些浏览器下，粘贴从word复制过来的文本还会把word中的格式也粘贴进来，导致功能的错误。所以针对contenteditable粘贴格式的问题，给出了以下的解决方案。

<div contenteditable="true"></div>

解决方案：
兼容ie11,edge,chrome,firefox,safari:

document.querySelector('div[contenteditable="true"]').addEventListener("paste", function(e) {
        e.stopPropagation();
        e.preventDefault();
        var text = '', event = (e.originalEvent || e);
        if (event.clipboardData && event.clipboardData.getData) {
            text = event.clipboardData.getData('text/plain');
        } else if (window.clipboardData && window.clipboardData.getData) {
            text = window.clipboardData.getData('Text');
        }
        if (document.queryCommandSupported('insertText')) {
            document.execCommand('insertText', false, text);
        } else {
            document.execCommand('paste', false, text);
        }
});