jquery、js 复制到黏贴板

说明：新版浏览器差不多均可以（ie9以下不可以），试过内核比较老版本的浏览器为了安全是禁止复制的，所以要实现复制要开启浏览器配置的参数（/但这样不安全)，有的浏览器复制之前是会提示是否允许复制，若禁止提示或直接叉掉或拒绝，复制功能都会失效

一：jquery 插件

1.clipboard.js

官网：https://clipboardjs.com/ （使用方法参考官网）

使用注意：

1.引用插件js文件：如<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/1.7.1/clipboard.min.js"></script>

2.实例化：new Clipboard('.类名') 要实现复制功能的按钮须添加上指定class ，如new Clipboard('.btn')

3.实现复制（基本使用）：

（1）data-clipboard-target="#复制标签的id" //复制内容为复制标签的value

<inputid="foo"value="https://github.com/zenorocha/clipboard.js.git">

<buttonclass="btn"data-clipboard-target="#foo"><imgsrc="assets/clippy.svg"alt="Copy to clipboard"></button>

<textareaid="bar">Mussum ipsum cacilds...</textarea>

<buttonclass="btn"data-clipboard-action="cut"data-clipboard-target="#bar"> Cut to clipboard</button>

（2）data-clipboard-text="复制文本"

<buttonclass="btn"data-clipboard-text="Just because you can doesn't mean you should — clipboard.js"> Copy to clipboard</button>

（3）事件：

var clipboard = new Clipboard('.btn');

clipboard.on('success',function(e){

console.info('Action:', e.action);

console.info('Text:', e.text);

console.info('Trigger:', e.trigger);

e.clearSelection();

});

clipboard.on('error',function(e){

console.error('Action:', e.action);

console.error('Trigger:', e.trigger);

});

具体查看官网

2.zclip(js和jq两个版本，最大缺点是要使用flash)

（1）jquery-zclip：

github：https://github.com/patricklodder/jquery-zclip

简单使用如下（具体看文档)：

引入js文件：<script type="text/javascript" src="../js/jquery_zclip/jquery.zclip.js"></script>

复制内容控件：

jquery方法：

$(".copyData-btn2").zclip({
path: '../js/jquery_zclip/ZeroClipboard.swf',
copy: function(){
return $(this).data('copy');
}
});

http://www.cnblogs.com/tinyphp/p/3394819.html

（2）ZeroClipboard.js

http://www.cnblogs.com/tinyphp/p/3307522.html

3.js： document.execCommand("copy")

4.老版本浏览器内核支持

 function copyToClipboard(txt) {
              if (window.clipboardData) {
                  window.clipboardData.clearData();
                  clipboardData.setData("Text", txt);
                  alert("复制成功！");
  
              } else if (navigator.userAgent.indexOf("Opera") != -1) {
                  window.location = txt;
              } else if (window.netscape) {
                 try {
                     netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
                 } catch (e) {
                     alert("被浏览器拒绝！\n请在浏览器地址栏输入'about:config'并回车\n然后将 'signed.applets.codebase_principal_support'设置为'true'");
                 }
                 var clip = Components.classes['@mozilla.org/widget/clipboard;1'].createInstance(Components.interfaces.nsIClipboard);
                 if (!clip)
                     return;
                 var trans = Components.classes['@mozilla.org/widget/transferable;1'].createInstance(Components.interfaces.nsITransferable);
                 if (!trans)
                     return;
                 trans.addDataFlavor("text/unicode");
                 var str = new Object();
                 var len = new Object();
                 var str = Components.classes["@mozilla.org/supports-string;1"].createInstance(Components.interfaces.nsISupportsString);
                 var copytext = txt;
                 str.data = copytext;
                 trans.setTransferData("text/unicode", str, copytext.length * 2);
                 var clipid = Components.interfaces.nsIClipboard;
                 if (!clip)
                     return false;
                 clip.setData(trans, null, clipid.kGlobalClipboard);
                 alert("复制成功！");
             }
         }

http://www.cnblogs.com/athens/archive/2013/01/16/2862981.html

jquery、js 复制到黏贴板

猜你喜欢