JS 复制后修改复制内容

原创于 2021-04-15 13:54:57 发布 · 1.2k 阅读

2 ·

CC 4.0 BY-SA版权

js 专栏收录该内容

7 篇文章

订阅专栏

本文介绍了如何处理因内部元素导致的复制后文本换行问题，通过监听浏览器的复制事件并利用ClipboardAPI进行异步操作，实现文本换行符的替换，确保在主流浏览器中的兼容性。此方法可以防止复制内容时产生不必要的换行，提高用户体验。

浏览器支持程度不同，不过主流浏览器基本都OK

场景

因内部元素的问题，复制后粘贴的文本总是会被换行，需要做优化处理
代码:

//此处仅进行全局的操作，如果想监听特定区域的应获取Element对象绑定事件
document.oncopy = () => {// 监听浏览器复制事件
        event.preventDefault();//阻止默认事件，防止复制真实发生
        let content = window.getSelection().toString();//获取复制的文本值
        event.clipboardData.setData("text", content.replace(/[\n\r]/g,' '));//使用replace替换掉换行符，同时用\n\r是为了防止不同系统的不同换行符
    };