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. bzoj1499: [NOI2005]瑰丽华尔兹&&codevs1748 单调队列优化dp

    这道题 网上题解还是很多很好的 强烈推荐黄学长 码风真的好看 神犇传送门 学习学习 算是道单调队列优化dp的裸题吧 #include<cstdio> #include<cstring ...

  2. Django-models,继承AbstractUser类

    1.UserInfo类继承了Django模型自带的User类,需要导入AbstractUser   2.然后在settings.py中配置

  3. Django-urls路由分发

      例如:127.0.0.0:8000/blog/lucaq.html,当有多个应用时,需要在blog应用下进行路由,我们在blog应用下做一个urls路由分发,就需要include模块实现.   导 ...

  4. android 使用开源库zxing生成二维码,扫描二维码【转】

    转自:http://blog.csdn.net/qq_16064871/article/details/52422723 zxing是一个开放源码的,用Java实现的多种格式的1D/2D条码图像处理库 ...

  5. kvm的vmcall

    这几个接口的区别在于参数个数的不用,本质是一样的.挑个参数最多的看下: static inline long kvm_hypercall4(unsigned int nr, unsigned long ...

  6. appium===报错adb server version (31) doesn’t match this client (39); killing…的解决办法

    当使用在cmd窗口调用adb shell命令的时候 提示如下: adb server version (31) doesn't match this client (39); killing...er ...

  7. GLE api

    # -*- coding: utf-8 -*-# @Time : 2018/03/09 12:25# @Author : cxa# @File : gle.py# @Software: PyCharm ...

  8. 获取span中的值

    js-code:var baseinfoallfeesum=$("#allFeeSum").html(); $("#baseInfoAllFeeSum").va ...

  9. selenium 3.0鼠标事件 (java代码)

    注意:ActionChains下相关方法在当前的firefox不工作,建议使用谷歌浏览器. public static void main(String[] args) throws Interrup ...

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

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