jquery複製到剪貼板

時間 2019-12-01

原文原文鏈接



<!DOCTYPE html>  
<html>  
<head>  
<title>ZeroClipboard Test</title>  
<meta charset="utf-8">  
<script type="text/javascript" src="clipboard.min.js"></script>  
<script type="text/javascript" src="jquery-1.10.2.min.js"></script>  
</head>  
<body>  
  
<input id="t" type="text"/>數據輸出測試<br>  
<textarea id="t2"></textarea><br>  
<!--測試1-->  
<!--button按鈕測試，須要複製的值放在屬性  data-clipboard-text中<br>-->  
<button class="btn" data-clipboard-text="測試1">點擊測試1</button><br><br>  
  
<!--測試2-->  
<!--a按鈕測試，須要複製的值放在屬性 data-clipboard-text中<br>-->  
<a class="a" data-clipboard-text="測試2">點擊測試2</a><br><br>  
  
<!--測試3-->  
<!--測試，經過按鈕的data-clipboard-target屬性獲取指定標籤中的值-->  
<div>測試3</div>  
 <button class="btn2" data-clipboard-action="copy" data-clipboard-target="div">點擊測試3</button><br><br>  
  
 <!--測試4-->  
 <!--測試，經過按鈕的data-clipboard-target屬性獲取指id的標籤中的值中 -->  
 <button class="btn3" data-clipboard-action="copy" data-clipboard-target="#t2">點擊測試4</button>  
  
</body>  
</html>  
<script type="text/javascript">  
<!--測試1-->  
$(document).ready(function(){    
   var clipboard = new Clipboard('.btn');   
   clipboard.on('success', function(e) {  
       console.log(e);  
        alert("測試1複製成功！")  
        });  
   clipboard.on('error', function(e) {  
               console.log(e);  
               alert("測試1複製失敗！請手動複製")  
        });  
})  
<!--測試2-->  
$(document).ready(function(){    
   var clipboard1 = new Clipboard('.a');   
   clipboard1.on('success', function(e) {  
       console.log(e);  
        alert("測試2複製成功！")  
        });  
   clipboard1.on('error', function(e) {  
               console.log(e);  
               alert("測試2複製失敗！請手動複製")  
        });  
})  
<!--測試3-->  
$(document).ready(function(){    
   var clipboard2 = new Clipboard('.btn2');   
   clipboard2.on('success', function(e) {  
       console.log(e);  
        alert("測試3複製成功！")  
        });  
   clipboard2.on('error', function(e) {  
               console.log(e);  
               alert("測試3複製失敗！請手動複製")  
        });  
})  
<!--測試4-->  
$(document).ready(function(){    
   var clipboard3 = new Clipboard('.btn3');   
   clipboard3.on('success', function(e) {  
       console.log(e);  
        alert("測試4複製成功！")  
        });  
   clipboard3.on('error', function(e) {  
               console.log(e);  
               alert("測試4複製失敗！請手動複製")  
        });  
})  
</script>

下載地址  https://github.com/zenorocha/clipboard.js

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。