首页> 实战笔录 >前端开发 >JQuery JQuery
Jquery实现点击按钮复制数据到剪切板
作者:小萝卜 2020-05-21 【 jquery 】 浏览 1532
简介绝对有效,Jquery实现点击按钮复制数据到剪切板
源码如下:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery/Js复制文本到剪贴板</title>
<script src="http://apps.bdimg.com/libs/jquery/1.8.3/jquery.js"></script>
<script src="https://cdn.jsdelivr.net/clipboard.js/1.5.12/clipboard.min.js"></script>
</head>
<body>
<input type="text" name="name" id="target" class="required input-xlarge" value="www.baidu.com" readonly ="" >
<input type="button" name="" data-clipboard-action="copy" data-clipboard-target="#target" id="copy_btn"value="复制地址" style="margin-bottom: 10px;">
<script>
$(document).ready(function(){
var targetText=$("#target").text();
var clipboard = new Clipboard('#copy_btn');
clipboard.on('success', function(e) {
// console.info('Action:', e.action);
// console.info('Text:', e.text);
// console.info('Trigger:', e.trigger);
// alert("复制成功");
alert('复制成功');
e.clearSelection();
});
});
</script>
</body>
</html>
很赞哦! (0)