js实现复制功能

最新推荐文章于 2024-08-23 15:44:50 发布

Blooming_x

最新推荐文章于 2024-08-23 15:44:50 发布

阅读量326

点赞数

分类专栏： js

本文链接：https://blog.csdn.net/Blooming_x/article/details/117924570

版权

JavaScript copy方法 input.select() 链接复制 DOM操作

关键词由CSDN通过智能技术生成

js 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

因为js提供了copy的方法，但是需要选中文本，不然复制的就是自己，
然而input提供了select()选中的方法，所以就需要两种方法结合起来

	<span id="lj_text">https://haosell.yqygs.com.phpdhusdhfn-3472hnnj</span>
	<textarea id="textarea"></textarea>
	<el-button type="primary" style="margin-left: 30px;width: 130px;" @click="copyText('#lj_text')">点击复制链接</el-button>

样式设置：把文本框隐藏

#textarea{
	    position: absolute;
	    top: 0;
	    left: 0;
	    opacity: 0;
	    z-index: -10;
	}

copyText(card){
			    let text=document.querySelector(card).innerText;
			    let input=document.querySelector("#textarea");
			    input.value=text;
			    input.select();
			    document.execCommand("copy");
			    this.$message({
			        message: '复制成功！',
			        type: 'success'
			    });
			},