jquery复制到剪贴板,html复制到剪贴板

js/jQuery怎么自动复制到剪贴板

出于安全问题，无法使用原生的 JS 或 jQuery 来操作粘贴板。除非使用浏览器扩展（需设置权限），或者使用Flash。

某些浏览器允许在文本框内使用 document.execCommand('copy') 与 document.execCommand('paste') 来操作剪贴板。

（但现在基于较新版本的webkit内核以及主流的浏览器，该命令已经被False）

相关问答

Q1: jquery 复制到粘贴板

function copyToClipBoard(id){

$("#"+id).text().clone();

alert("复制成功！");

}

Q2: 如何使用jquery一键复制到剪切板

html部分

!DOCTYPE html

html

head

titleZeroClipboard 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"/textareabr

!--测试1--

!--button按钮测试，需要复制的值放在属性  data-clipboard-text中br--

button class="btn" data-clipboard-text="测试1"点击测试1/buttonbrbr

 

!--测试2--

!--a按钮测试，需要复制的值放在属性 data-clipboard-text中br--

a class="a" data-clipboard-text="测试2"点击测试2/abrbr

 

!--测试3--

!--测试，通过按钮的data-clipboard-target属性获取指定标签中的值--

div测试3/div

 button class="btn2" data-clipboard-action="copy" data-clipboard-target="div"点击测试3/buttonbrbr

 

 !--测试4--

 !--测试，通过按钮的data-clipboard-target属性获取指id的标签中的值中 --

 button class="btn3" data-clipboard-action="copy" data-clipboard-target="#t2"点击测试4/button

 

/body

/html

jquery部分：

!--测试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复制失败！请手动复制")

});

})

注：此方法主要使用了clipboard，无需通过其他文件，引入一个clipboard.js文件即可使用，简单方便

clipboard.js库文件下载地址

Q3: 有哪位同志做过jquery实现文本框内容到剪贴板的方法

1. 单用js 实现复制功能， 仅仅只能对ie起作用； 其他安全性高的游览器是不行的，如 firfox, chrome 等。

2. 遇到这个功能一般做法是： 用js判断是不是ie， 如是，复制，如不是，自动选中文字，提示让他自己手工复制。腾讯公司的网站就是这样的做法。

3. flash可以做到通用， 但是不推荐，原因是flash 有可能用户游览器不支持或根本没安装