1条回答我要回复
坚强的心1263天前如何使用html5页面ClipboardJS实现点击复制功能？
官方文档：<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<title>this is 方案 1 </title>
<script src="
<!--以下三个是备用 浏览器打不开第一个 换下面的-->
<!--<script src="
<!--<script src="
<!--<script src="
</head>
<body>
<!-- Target -->
<input id="foo" value="
<!-- Trigger -->
<button data-clipboard-target="#foo">
Copy to clipboard
</button>
<hr>
<br>
<!-- Trigger -->
<button data-clipboard-text="Just because you can doesn't mean you should — clipboard.js">
Copy to clipboard
</button>
<script>
//必须要初始化 第一种初始化
var clipboard = new ClipboardJS('.btn');
clipboard.on('success', function(e) {
console.log(e);
});
clipboard.on('error', function(e) {
console.log(e);
});
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>this is 方案 2</title>
<meta name="viewport" cOntent="width=device-width, initial-scale=1">
</head>
<body>
<!-- 1. Define some markup -->
<div id="btn" data-clipboard-text="1">
<span>Copy</span>
</div>
<!-- 2. Include library -->
<script src="
<!--以下三个是备用 浏览器打不开第一个 换下面的-->
<!--<script src="
<!--<script src="
<!--<script src="
<!-- 3. Instantiate clipboard by passing a HTML element -->
<script>
var btn = document.getElementById('btn');
var clipboard = new ClipboardJS(btn);
clipboard.on('success', function(e) {
console.log(e);
});
clipboard.on('error', function(e) {
console.log(e);
});
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>多个选择器下的复制</title>
<meta name="viewport" cOntent="width=device-width, initial-scale=1">
</head>
<body>
<!-- 1. Define some markup -->
<button data-clipboard-text="1">Copy</button>
<button data-clipboard-text="2">Copy</button>
<button data-clipboard-text="3">Copy</button>
<!-- 2. Include library -->
<!-- 2. Include library -->
<script src="
<!--以下三个是备用 浏览器打不开第一个 换下面的-->
<!--<script src="
<!--<script src="
<!--<script src="
<!-- 3. Instantiate clipboard by passing a list of HTML elements -->
<script>
var btns = document.querySelectorAll('button');
var clipboard = new ClipboardJS(btns);
clipboard.on('success', function(e) {
console.log(e);
});
clipboard.on('error', function(e) {
console.log(e);
});
</script>
</body>
</html>
请先登录后，再回复
登录/注册
行家里手-技能共享平台