autojs粘贴文本_原生js实现点击按钮复制内容到剪切板

本文实例为大家分享了js点击按钮复制内容到剪切板的具体代码,供大家参考,具体内容如下

效果图

上代码

Document

.divBox {

width: 500px;

margin: 100px auto;

display: flex;

}

.popupStyle {

display: none;

width: 160px;

background-color: rgb(85, 85, 85);

color: aqua;

text-align: center;

border-radius: 6px;

padding: 8px 0;

position: fixed;

z-index: 1;

top: 2%;

left: 50%;

margin-left: -80px;

}

这是要复制的div内容

点击复制

Hello,World

点击复制

// 复制 div 内容

function handleDivCopy() {

const div = document.getElementById("div");

const input = document.createElement("input");

document.body.appendChild(input);

input.value = div.innerText;

input.select();

try {

if (document.execCommand("copy", false)) {

handleDomMsg("div 内容复制成功");

} else {

handleDomMsg("div 内容复制失败");

}

} catch (error) {

console.log(error, "error")

} finally {

input.remove();

}

};

// 复制输入框内容

function handleCopy() {

const textarea = document.getElementById("textarea");

textarea.select();

try {

if (document.execCommand("copy", false)) {

handleDomMsg("输入框内容复制成功");

} else {

handleDomMsg("输入框内容复制失败");

}

} catch (error) {

console.log(error, "error")

}

};

// DOM 弹窗

function handleDomMsg(message) {

const div = document.createElement("div");

document.body.appendChild(div);

div.innerHTML = message || "this is a Message";

div.className = "popupStyle";

div.style.display = "block";

setTimeout(() => {

div.remove();

}, 1000);

}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

已标记关键词 清除标记
表情包
插入表情
评论将由博主筛选后显示,对所有人可见 | 还能输入1000个字符
相关推荐
©️2020 CSDN 皮肤主题: 数字20 设计师:CSDN官方博客 返回首页