文档章节

浏览器复制剪切板

ricoc
 ricoc
发布于 2015/10/22 20:45
字数 175
阅读 26
收藏 0

参考链接:

http://zenorocha.github.io/clipboard.js/

http://www.jb51.net/article/72996.htm

例子:

<script src="clipboard.min.js"></script>
<textarea id="bar" cols="62" rows="5" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false">脚本</textarea>
 
<!-- Trigger -->
<button class="btn" data-clipboard-action="copy" data-clipboard-target="#bar">
  Cut to clipboard
</button>
<a id="copyBtn" class="btn" data-clipboard-action="copy" data-clipboard-target="#bar">Copy</a>

<script>
var clipboard = new Clipboard('#copyBtn');	// 对应id="copyBtn"
//var clipboard = new Clipboard('.btn');	// 对应class=“btn”
/*
  事件监听
  clipboard.on('success', function(e) {
  console.info('Action:', e.action);
  console.info('Text:', e.text);
  console.info('Trigger:', e.trigger);
  alert("复制成功");
  e.clearSelection();
});
 
clipboard.on('error', function(e) {
  console.error('Action:', e.action);
  console.error('Trigger:', e.trigger);
});
*/
</script>


data-clipboard-action(操作类型):复制copy(默认)或剪切cut

data-clipboard-target:指定复制目标

<!-- Target -->
<input id="foo" value="https://github.com/zenorocha/clipboard.js.git">
<!-- Trigger -->
<button class="btn" data-clipboard-target="#foo">
    <img src="assets/clippy.svg" alt="Copy to clipboard">
</button>


 



© 著作权归作者所有

上一篇: 单例模式
下一篇: Java加密工具类
ricoc
粉丝 5
博文 29
码字总数 22542
作品 0
广州
私信 提问
jquery+flash(zclip)实现点击复制到剪切板

jQuery-zclip是一个复制内容到剪贴板的jQuery插件,使用它我们不用考虑不同浏览器和浏览器版本之间的兼容问题。jQuery-zclip插件需要Flash的支持,使用时记得电脑安装Adobe Flash Player。 ...

东子
2014/09/20
3.3K
2
javascript 实现跨浏览器的粘贴,复制,剪切功能(转)

这两天在做跨浏览器的粘贴、复制、剪切功能。 本以为是很简单的事,原来并不简单。 网上查了很多资料。都是跨浏览器把文本复制到剪切板的实现方案(zero clipboard.js)。没有跨浏览器粘贴的...

苏叶晚晚
2012/09/26
1K
0
CoLT

通过使用 CoLT,复制超链接文字或者同时复制超链接及其文字(以你指定的格式)将变得更为容易。 CoLT 在浏览器的右键菜单中增加了两个菜单项,只有右键点击一个超链接的时候才会看到。“复制...

匿名
2008/09/19
803
0
vi的复制粘贴命令

vi的复制粘贴命令 2015-08-09 13:29 1426人阅读 评论(1) 收藏 举报 分类: linux(4) vi编辑器有3种模式:命令模式、输入模式、末行模式。掌握这三种模式十分重要:   命令模式:vi启动后...

片刻
2015/12/23
128
0
Zero Clipboard-js复制到剪切板(支持多浏览器)

在前端开发中经常会遇到这样的问题,要求用js将输入框或者div中的内容复制到剪切板。在ie下可以通过clipboardData.setData来实现,但是这个方法却不能兼容其他的浏览器。显然这种方法在这个浏...

mickelfeng
2014/01/22
310
0

没有更多内容

加载失败,请刷新页面

加载更多

MongoDB系列-解决面试中可能遇到的MongoDB复制集(replica set)问题

关注我,可以获取最新知识、经典面试题以及微服务技术分享   MongoDB复制集(replica set):MongoDB复制集维护相同数据集的一组mongod进程,复制集是生产部署的基础,具有数据冗余以及高可用...

ccww_
31分钟前
4
0
SpringBoot系列:Spring Boot集成Spring Cache,使用RedisCache

前面的章节,讲解了Spring Boot集成Spring Cache,Spring Cache已经完成了多种Cache的实现,包括EhCache、RedisCache、ConcurrentMapCache等。 这一节我们来看看Spring Cache使用RedisCache。...

杨小格子
40分钟前
3
0
OpenJDK之CountDownLatch

OpenJDK8,本人看的是openJDK。以前就看过,只是经常忘记,所以记录下 图1 CountDownLatch是Doug Lea在JDK1.5中引入的,作用就不详细描述了, await()方法,如果还有线程在执行,那么当前线程...

克虏伯
46分钟前
4
0
简单编程

1.编写一个程序,提示用户输入名和姓,然后以“名,姓”的格式打印出来。 #include<stdio.h>int main(){char name[3];char family[3];printf("Please input your name and family:\n...

电子工程197沈志初
50分钟前
4
0
详解Mysql分布式事务XA(跨数据库事务)

在开发中,为了降低单点压力,通常会根据业务情况进行分表分库,将表分布在不同的库中(库可能分布在不同的机器上)。在这种场景下,事务的提交会变得相对复杂,因为多个节点(库)的存在,可...

slagga
55分钟前
5
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部