VUE中使用js实现复制效果

八方研发

于 2023-08-03 14:58:57 发布

阅读量207

点赞数 1

分类专栏：前端文章标签： javascript vue.js 前端 vue

本文链接：https://blog.youkuaiyun.com/weixin_54364981/article/details/132083729

版权

前端专栏收录该内容

3 篇文章

订阅专栏

本文介绍了如何使用JavaScript在网页上实现一个简单的文本内容复制功能，通过创建`<textarea>`元素、聚焦、选择内容并执行`document.execCommand(copy)`来实现复制操作，最后移除元素

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

    copyContent(value) {
    //使用textarea可保存接受的值换行效果  也可使用input
        let transfer = document.createElement("textarea");
        document.body.appendChild(transfer);
        transfer.value = value; // 这里表示想要复制的内容
        transfer.focus(); //设置元素焦点
        transfer.select(); //获取元素内容
        // 复制操作
        document.execCommand("copy");
        transfer.blur(); //移除元素焦点
        document.body.removeChild(transfer); //移除元素所有子节点

    }