前端开发者html 代码
<!doctype html>
<html>
<head>
<meta charset=”utf-8″>
<title>js自动复制到剪贴板</title>
<meta content=”width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0″ name=”viewport”>
<style>
/* reset wap */
body,
p,
a,
div,
ol,
ul,
li,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
input,
iframe,
nav,
header,
footer {
margin: 0;
padding: 0;
list-style: none;
}
body {
font: 16px Microsoft YaHei, sans-serif;
-webkit-tap-highlight-color: transparent;
color: #2a2b2c;
background: #fff;
}
*,
*::before,
*::after {
outline: none;
box-sizing: border-box;
}
a,
img {
text-decoration: none;
display: block;
color: #2a2b2c;
border: 0;
}
input {
border: 0;
}
.d1 {
width: 360px;
height: 50px;
margin: 50px auto;
background: #eee;
}
</style>
</head>
<body>
<div class=”wrapper”>
<div class=”d1″>点击自动复制到剪贴板1</div>
<div class=”d1″>点击自动复制到剪贴板2</div>
<div class=”d1″>点击自动复制到剪贴板3</div>
</div>
<script>
$(function () {
$(‘.d1’).on(‘click’, function () {
oCopy(this);
return false;
});
function oCopy(ele) {
const range = document.createRange();
range.selectNode(ele);
const selection = window.getSelection();
selection.rangeCount > 0 && selection.removeAllRanges();
selection.addRange(range);
document.execCommand(‘copy’);
}
});
</script>
</body>
</html>
web前端开发制作网站素材 前端开发必知道的网站 前端开发前端环境
» 本文来自：前端开发者 » 《前端js实现自动复制到剪贴板》
» 本文链接地址：https://www.rokub.com/5391.html
» 您也可以订阅本站：https://www.rokub.com
评论前必须登录！
注册