JS 怎么监听复制事件 并获取复制内容 并修改复制文本内容

需求背景:

需要禁用部分文本内容的复制事件,并且在复制事件发生时,将复制的文本内容通过接口传给后端。

上代码:

javascript 复制代码
    // 使用Dom获取需要操作禁用时间的元素
    let element: any = document.getElementById('test1');

    // 为该元素添加 copy 事件监听器
    element.addEventListener('copy', function (event: any) {
      // 在这里编写你想要执行的操作
      console.log('复制事件被触发');

      var selection: any = window.getSelection();
      var selectedText = selection.toString();
      console.log(selectedText, '打印查看复制的文本内容')
      // 将selectedText调用接口传给后端

      // 可以通过 event.clipboardData 对象来设置剪贴板的数据
      event.clipboardData.setData('text/plain', '自定义的复制文本(替换复制的文本内容)');

      // 阻止默认的复制行为
      event.preventDefault();
    });
相关推荐
Never_Satisfied8 分钟前
在JavaScript中,将包含HTML实体字符的字符串转换为普通字符
开发语言·javascript·html
im_AMBER25 分钟前
React 12
前端·javascript·笔记·学习·react.js·前端框架
开开心心就好25 分钟前
电脑音质提升:杜比全景声安装详细教程
java·开发语言·前端·数据库·电脑·ruby·1024程序员节
午安~婉36 分钟前
HTML CSS八股
前端·css·html
有事没事实验室37 分钟前
css变量
前端·css
前端付豪1 小时前
Vue 中的 JSX:让组件渲染更灵活的正确方式
前端·javascript·vue.js
在泡泡里1 小时前
前端规范【四】eslint(antfu)、lefthook、commitlint
前端
烛阴1 小时前
Python 几行代码,让你的照片秒变艺术素描画
前端·python
Jolyne_1 小时前
如何实现无感刷新Token
前端
用户4099322502121 小时前
Vue3响应式系统的底层原理与实践要点你真的懂吗?
前端·ai编程·trae