I G U P
web爱好者
Copyright©2018 by igup

js中execCommand 复制

//添加复制效果 //text:复制内容的来源
function copy(text) {
var textArea = document.createElement(“textarea”)
textArea.style.position = ‘fixed’
textArea.style.top = 0;
textArea.style.left = 0;
textArea.style.width = ‘2em’;
textArea.style.height = ‘2em’;
textArea.style.padding = 0;
textArea.style.border = ‘none’;
textArea.style.outline = ‘none’;
textArea.style.boxShadow = ‘none’;
textArea.style.background = ‘transparent’;
textArea.value = text;
document.body.appendChild(textArea)
textArea.select()
try {
var msg = document.execCommand(‘copy’) ? ‘复制成功’ : ‘复制失败’;

console.log(msg);

} catch (err) {
alert(‘很遗憾,复制失败,由于浏览器过于老化,请更换至IE7以上版本浏览器或者其他浏览器!’)
}
document.body.removeChild(textArea);
}

只需要在使用的时候,调用 copy方法即可,    text为你要复制的内容

例:           (点击button 复制 span中的内容)

<span>123<span>

<button>点我复制上面的内容</button>

<script>

var btn=document.getElementsByTagName(“button”)[0];

var text=document.getElementsByTagName(“span”)[0];

//点击button复制span中的内容

btn.onclick= function () {

copy(text.innerHTML);

}

function copy(text) {
var textArea = document.createElement(“textarea”)
textArea.style.position = ‘fixed’
textArea.style.top = 0;
textArea.style.left = 0;
textArea.style.width = ‘2em’;
textArea.style.height = ‘2em’;
textArea.style.padding = 0;
textArea.style.border = ‘none’;
textArea.style.outline = ‘none’;
textArea.style.boxShadow = ‘none’;
textArea.style.background = ‘transparent’;
textArea.value = text;
document.body.appendChild(textArea);
textArea.select();
try {
var msg = document.execCommand(‘copy’) ? ‘辅助成功’ : ‘复制失败’;
console.log(msg);
} catch (err) {
alert(‘很遗憾,复制失败,由于浏览器过于老化,请更换至IE7以上版本浏览器或者其他浏览器!’)
}
document.body.removeChild(textArea);
}

</script>

 

 

2018-05-28
文章归档:

1
说点什么

  Subscribe  
提醒
种太阳
种太阳

这种写法移动端兼容性太差了