<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Zero Clipboard</title>
<script src="js/jquery.js"></script>
<script src="js/ZeroClipboard.js"></script>
<script language="JavaScript">
$(function(){
for(i=1;i<31;i++){
var clip = new ZeroClipboard($("#btn" + i));
}
clip.on('complete', function (client, args) {
debugstr(args.text );
});
function debugstr(text) {
$("#d_debug").append($("<p>").text(text));
}
$("#clear-test").on("click", function(){
$("#testarea").val("");
clip.resetText();
});
})
</script>
</head>
<body>
<div style="float:right; width:300px;">
<h4>Debug Console:</h4>
<div id="d_debug"></div>
</div>
<div>
<button id="btn1" data-clipboard-text="Copy1">复制</button><br><br>
<button id="btn2" data-clipboard-text="Copy2">复制</button><br><br>
<button id="btn3" data-clipboard-text="Copy3">复制</button><br><br>
<button id="btn4" data-clipboard-text="Copy4">复制</button><br><br>
<button id="btn5" data-clipboard-text="Copy5">复制</button><br><br>
<button id="btn6" data-clipboard-text="Copy6">复制</button><br><br>
<button id="btn7" data-clipboard-text="Copy7">复制</button><br><br>
<button id="btn8" data-clipboard-text="Copy8">复制</button><br><br>
<button id="btn9" data-clipboard-text="Copy9">复制</button><br><br>
<button id="btn10" data-clipboard-text="Copy10">复制</button><br><br>
<button id="btn11" data-clipboard-text="Copy11">复制</button><br><br>
<button id="btn12" data-clipboard-text="Copy12">复制</button><br><br>
<button id="btn13" data-clipboard-text="Copy13">复制</button><br><br>
<button id="btn14" data-clipboard-text="Copy14">复制</button><br><br>
<button id="btn15" data-clipboard-text="Copy15">复制</button><br><br>
<button id="btn16" data-clipboard-text="Copy16">复制</button>
<button id="btn17" data-clipboard-text="Copy17">复制</button>
<button id="btn18" data-clipboard-text="Copy18">复制</button>
<button id="btn19" data-clipboard-text="Copy19">复制</button>
<button id="btn20" data-clipboard-text="Copy20">复制</button>
<button id="btn21" data-clipboard-text="Copy21">复制</button>
<button id="btn22" data-clipboard-text="Copy22">复制</button>
<button id="btn23" data-clipboard-text="Copy23">复制</button>
<button id="btn24" data-clipboard-text="Copy24">复制</button>
<button id="btn25" data-clipboard-text="Copy25">复制</button>
<button id="btn26" data-clipboard-text="Copy26">复制</button>
<button id="btn27" data-clipboard-text="Copy27">复制</button>
<button id="btn28" data-clipboard-text="Copy28">复制</button>
<button id="btn29" data-clipboard-text="Copy29">复制</button>
<button id="btn30" data-clipboard-text="Copy30">复制</button>
<h4>
<label for="testarea">Paste Text Here</label>
</h4>
<textarea id="testarea" cols="50" rows="3"></textarea>
<p>
<button id="clear-test">Clear Test Area</button>
</p>
</div>
</body>
</html>
引入ZeroClipboard.js和ZeroClipboard.swf最新版本的。1.1.7版本的。
查找源码：http://jonrohan.github.io/ZeroClipboard/#demo
https://github.com/jonrohan/ZeroClipboard
相关推荐
因需求要实现点击复制功能。使用clipboard.js实现页面内容复制到剪贴板。
移动端js 点击按钮复制到粘贴，有demo和js包，很好的例子
移动端js 点击按钮复制到粘贴，有demo和js包，兼容性比较强
最近做了一个前端项目，其中有需求：通过button直接把input或者textarea里的值复制到粘贴板里。下面小编给大家分享JavaScript实现复制内容到粘贴板代码，需要的朋友参考下
移动端js 点击按钮复制到粘贴，有demo和js包，兼容性比较强
项目中需要实现一个点击按钮复制链接的功能，网上看到的几款插件，ZeroClipboard是通过flash实现的复制功能，随着越来越多的提议废除flash，能不能通过JS来实现复制剪切呢，今天分享一个兼容IE7浏览器复制的插件给...
在上一种方式的复制功能中补充了另外一种方式，js复制功能目前就这点认识了，有新的认识了再补充或完善。 功能：点击“复制”按钮，复制“文本内容”
1 . npm安装到项目目录文件中 npm install clipboard --save 2 .... import Clipboard from 'clipboard'; 3 . 在需要html元素中的自定义属性中data-... 在JavaScript中通过类名找到元素中的内容。 let clipboard = new
本文实例为大家分享了js点击按钮复制文本到粘贴板的具体代码，供大家参考，具体内容如下 准备：先去下载clipboard.js: 官网 移动端效果如下： 应用：html+js 代码如下： <!DOCTYPE html> <...
最近做到需要点击复制按钮就把文本框中内容，复制下来的功能。相当于右键复制功能，本人就小研究了一下，与大家分享一下~！
最近在做一个按钮，实现的效果是当点击后复制url到黏贴板，但不是当前页面url，而是对应一个元素的url，且一个页面会有多个url。一开始找到一个方法，但是竟然只兼容IE浏览器，神奇了，竟然有只兼容IE的东西。后来...
菜鸟网页模板复制可以复制目前众多网站的模板，根据自定义的路径进行复制，可将JS脚本、图片、样式等内容完整的复制下来。当前工具模板为V2.0，后期将继续完善与修改工具的功能！ 菜鸟网页模板复制工具操作说明 ...
html点击复制指定内容(点击按钮复制当前网址)，今天在优化下载插件的时候发现需要密码下载的文件，密码还需要手动复制粘贴感觉太麻烦了，找了很多JS实现自动复制的文章很多都要调用clipboard插件才能实现，这款不...
在项目中，需要开发一个复制邀请码的功能，也就是点击复制按钮就将邀请码复制到粘贴板，直接粘贴即可。 使用到的是 vue-clipboard2 插件，简单又好用 首先，需要先安装这个插件 npm install --save vue-clipboard2...
Enable Copy是一款针对以Chrome为内核的浏览器的破解网站禁止复制插件，当用户安装好此插件，只需要点击浏览器右上角的Enable Copy 插件图案，即可复制那些网页不能复制的内容，对于从事编辑的人员非常有用，建议...
本文实例讲述了javascript实现复制与粘贴操作的方法。分享给大家供大家参考。 具体实现方法如下： 代码如下:[removed] function readTxt() { alert(window.clipboardData.getData(“text”)); } ...
主要介绍了js实现点击复制当前文本到剪贴板功能，兼容所有浏览器，感兴趣的小伙伴们可以参考一下
使用剪贴板是一项基本技能。作为码农都应知道， Tab , Ctrl/Cmd ...那么我们是否应该提供一个“复制到剪贴板”按钮来帮助用户？这功能应该会很有用，即使是对快捷键的人非常熟悉的用户来说。 关于剪贴板的安全 几年前，
最近做了一个项目，其中有这样一需求：实现一个点击按钮复制链接的功能，通过网上找相关资料，找到了几个插件，ZeroClipboard是通过flash实现的复制功能，随着越来越多的提议废除flash，于是就想能不能通过js来实现...
ZeroClipboard.js是一个支持复制和粘贴的JavaScript插件，目前官方已经到2.x的版本了，但不支持IE9以下的浏览器，而如果要兼容，则可以使用1.x的版本，我使用的是最开始的一个版本：1.0.7的。该版本支持IE7和IE8，...