1、简单的纯JS复制粘贴(兼容性差,只能用textarea标签)

  var btn=document.getElementsByClassName("btn")[0];  //复制按钮
btn.onclick=function(){
var foo = document.getElementById("foo");  //要复制的节点,只能是textarea
foo.select();
document.execCommand("Copy");
}

2、ClipboardJS插件的使用

(一)简单的使用

<textarea id="foo">123</textarea>  //被复制对象
<button class="btn" data-clipboard-target="#foo" data-clipboard-action="copy">复制</button>  //复制 new ClipboardJS('.btn');

(二)高级的使用

  ClipboardJS.isSupported()  //是否兼容

  var clipboard = new ClipboardJS('.btn', {
target: function(trigger) {
return document.getElementById("foo")  //选择对象
}
}); var clipboard = new ClipboardJS('.btn', {
text: function(trigger) {
return 123567;  //复制内容
}
}) 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);
});

  

ClipboardJS复制粘贴插件的使用的更多相关文章

  1. 复制粘贴插件(不包含 Flash)——clipboard.js

    clipboard.js是现代化的“复制到剪切板”插件.不包含 Flash.gzip 压缩后仅 3kb.不依赖 Flash 或其他臃肿的框架.API:https://clipboardjs.com c ...

  2. ZeroClipBoard 复制粘贴插件

    ZeroClipboard 1.    引用js 1 <script type="text/javascript" src="/ZeroClipboard.js&q ...

  3. 移动端复制粘贴clipboardjs

    官方网址: https://clipboardjs.com/ 不能一打开就直接触发复制粘贴: 参考博客: http://blog.csdn.net/twoByte/article/details/52 ...

  4. 通过如何通过js实现复制粘贴功能

    在ie中window.clipboardData(剪切板对象)是可以被获取,所以利用这个方法我们可以实现在IE当中复制粘贴的功能,demo如下! <html> <head> & ...

  5. C# WinForm:DataTable中数据复制粘贴操作的实现

    1. 需要实现类似于Excel的功能,就是在任意位置选中鼠标起点和终点所连对角线所在的矩形,进行复制粘贴. 2. 要实现这个功能,首先需要获取鼠标起点和终点点击的位置. 3. 所以通过GridView ...

  6. pycharm无法使用ctrl+c/v复制粘贴的问题

    最近在使用pycharm的时候发现不能正常使用ctrl+c/v进行复制粘贴,也无法使用tab键对大段代码进行整体缩进.后来发现是因为安装了vim插件的问题,在setting里找到vim插件,取消勾选即 ...

  7. js 复制粘贴功能记录

    最近工作中需要在前端页面中使用代码完成剪贴板的读写,网上搜索了下相应的资料,记录下... 这个功能有两个办法一个是js方式,一个是使用flash 一.JS方法 1.复制 首先复制的过程分为两步曲,无论 ...

  8. 让微信内置浏览器兼容clipboard.js 复制粘贴 ios 安卓

    <!--js copy事件--><script type="text/javascript" src="/static/js/clipboard.min ...

  9. Ckeditor 4 复制粘贴截图并转化base64格式保存至数据库

    虽然Ckeditor 中自带的有上传图片和文件的功能,但是有时候我们并不需要把图片保存至服务器的文件夹中. 反而是截图复制粘贴,把图片转化为base64格式保存在数据库中即可满足要求. 1.首先下载安 ...

随机推荐

  1. 【Foreign】魔法 [组合数][质因数分解]

    魔法 Time Limit: 10 Sec  Memory Limit: 256 MB Description Input Output 仅一行一个整数表示答案. Sample Input 4 10 ...

  2. 【BZOJ3942】Censoring [KMP]

    Censoring Time Limit: 10 Sec  Memory Limit: 128 MB[Submit][Status][Discuss] Description 有一个S串和一个T串,长 ...

  3. NYOJ 127 星际之门(一) (数学)

    题目链接 描述 公元3000年,子虚帝国统领着N个星系,原先它们是靠近光束飞船来进行旅行的,近来,X博士发明了星际之门,它利用虫洞技术,一条虫洞可以连通任意的两个星系,使人们不必再待待便可立刻到达目的 ...

  4. 百度面试题——top K算法

    需求 从一亿个数据中,找出其中最小的10个数. 分析 最笨的方法就是将这一亿个数据,按从小到大进行排序,然后取前10个.这样的话,即使使用时间复杂度为nlogn的快排或堆排,由于元素会频繁的移动,效率 ...

  5. 预处理ifndef

    #ifdef 详解 这几个宏是为了进行条件编译.一般情况下,源程序中所有的行都参加编译.但是有时希望对其中一部分内容只在满足一定条件才进行编译,也就是对一部分内容指定编译的条件,这就是“条件编译”.有 ...

  6. [ Openstack ] Openstack-Mitaka 高可用之 启动一个实例

    目录 Openstack-Mitaka 高可用之 概述    Openstack-Mitaka 高可用之 环境初始化    Openstack-Mitaka 高可用之 Mariadb-Galera集群 ...

  7. 【LVS 】NAT方式实现过程

    LVS-NAT方式实现负载均衡 一.环境介绍

  8. Selenium2+python自动化22-发送各种类型附件邮件【转载】

    前言 最近一些小伙伴,在搞邮箱的事情,小编于是去折腾了一下!总结了一些干货,与大家分享一下!速来,抱大腿,我要开车了! 基本思路就是,使用MIMEMultipart来标示这个邮件是多个部分组成的,然后 ...

  9. hdu 5750(数论)

    Dertouzos Time Limit: 7000/3500 MS (Java/Others)    Memory Limit: 131072/131072 K (Java/Others)Total ...

  10. radio和label关联问题,点击label改变颜色

    $(function () { $("#fangan :radio[name='price']").bind('click', function (event) { //$(thi ...