复制文本到剪切板

1.引用clipboard.js

<script src="https://cdn.bootcss.com/clipboard.js/2.0.1/clipboard.js"></script>

2.html

<!--邀请好友助力  begin-->
<div class="tanchuangBck" id="haoyouzhuliDisplay">
  <div class="tanchuang haoyouzhuliDisplay">
	<img src="../common/img/close.png" class="close" onclick="tanchuangClose(this)" />
	<h2 class="tanchuangTitle">邀请好友助力</h2>
	<div class="haoyouzhuliContent">
	  <p>复制以下链接给你的好友,好友助力增加火苗值</p>
	  <p id="copyContent">http//www.yimeiyi.com/jianlizhongxin</p>
	</div>
	<div>
	  <span class="button okButton" id="copyLianjie">复制链接</span>
	  <span class="button noButton" onclick="cancle(this)">取消</span>
	</div>
  </div>
</div>
<!--邀请好友助力  end-->

3.js
//	邀请好友助力中复制链接点击
	$("#copyLianjie").click(function(){
		var content = $("#copyContent").html();
		var clipboard = new ClipboardJS('#copyLianjie', {
			text: function() {
				return content;		
			}	
		});	
		clipboard.on('success', function(e) {
			alert("复制成功");	
		}); 	
		clipboard.on('error', function(e) {
			console.log(e);	
		});
	})

  

第二种:

<script type="text/javascript">
function copyUrl2()
    {
        var Url2=document.getElementById("biao1").innerText;
        var oInput = document.createElement('input');
        oInput.value = Url2;
        document.body.appendChild(oInput);
        oInput.select(); // 选择对象
        document.execCommand("Copy"); // 执行浏览器复制命令
        oInput.className = 'oInput';
        oInput.style.display='none';
        alert('复制成功');
    }
</script>
<div cols="20" id="biao1">12345678</div>
<input type="button" onClick="copyUrl2()" value="点击复制代码" />

  

 

posted @ 2018-09-27 09:17  小熊叶叶  阅读(119)  评论(0)    收藏  举报