HTML

  data-clipboard-action=“ copy ”  或者“cut”

  data-clipboard-target="#domName"

  data-clipboard-text = "要复制的文字"

JS

  var clipboard = new Clipboard('.btn');

  复制成功时执行:

  clipboard.on('success', function(e) {

    console.info('Action:', e.action); //copy或者cut

    console.info('Text:', e.text);//复制的文字

    console.info('Trigger:', e.trigger);// 触发事件的元素

    e.clearSelection(); //清除选中样式

   });

  复制失败时执行:

  clipboard.on('error', function(e) {  });

clipboard.js使用方法的更多相关文章

  1. Zero Clipboard js+swf实现的复制功能使用方法

    开发中经常会用到复制的功能,在 IE 下实现比较简单.但要想做到跨浏览器比较困难了.本文将介绍一个跨浏览器的库类 Zero Clipboard .它利用 Flash 进行复制,所以只要浏览器装有 Fl ...

  2. clipboard.js -- js实现将文本复制到剪贴板的方法

    资源 推荐使用:clipboard.js 官方教程地址:https://clipboardjs.com/#example-text 官方github地址:https://github.com/zeno ...

  3. h5微信浏览器复制粘贴--ios兼容问题的解决方法(clipboard.js插件)

    前段时间在做微信h5的时候,遇到了ios兼容,使用clipboard.js插件完美解决 下载地址:下载地址: https://github.com/zenorocha/clipboard.js cnd ...

  4. Clipboard.js – 现代方式实现复制文本到剪贴板

    复制文本到剪贴板应该并不难,目前已经有很成熟的 Flash 方法.但是 Flash 已经在很多场合不适用了,特别是随着 HTML5 技术的发展.今天推荐的这个 Clipboard.js 库不依赖 Fl ...

  5. js实现剪切、复制、粘贴——clipBoard.js

    摘要: 最近项目上要实现一个点击按钮复制链接的功能,刚开始查找了一些资料,找了几款插件,ZeroClipboard是通过flash实现的复制功能,随着越来越多的提议废除flash,于是就想能不能通过j ...

  6. 使用clipboard.js复制页面内容到剪切板

    最近在做一个的智能客服Web端浏览器应用,其中有一项需求是客户在获取系统返回的 答案后点击“复制答案”按钮将答案复制到系统剪切板.本以为这是一个小case,但是发现如果 要对各种主流浏览器都有良好的兼 ...

  7. clipboard.js一个可以在移动端一键复制的插件

    网址:https://clipboardjs.com/ 使用方法: 1.引入js <script src="dist/clipboard.min.js"></sc ...

  8. clipboard.js兼容ios

    再使用clipboard.js做项目时,项目需求是在非input,button等可以点击的标签(span,p,div)上实现点击来复制内容,在PC端和移动端android没问题,但是到了ios毫无反应 ...

  9. js实现点击复制网页内容(基于clipboard.js)

    浏览网页过程中会遇到点击复制链接地址的情况,下面就介绍一种实现方法,该方法是基于clipboard.js: 官网地址:https://clipboardjs.com/: clipboard.js使用比 ...

随机推荐

  1. Python(面向对象5——高级)

    面向对象进阶 一 isinstance(obj,cls)和issubclass(sub,super) isinstance(obj,cls)检查是否obj是否是类 cls 的对象 1 class Fo ...

  2. centos7 vim显示行号

    CentOS7下可能有n个账户,让vim显示行号有两种方法:仅让当前用户显示行号和让所有用户显示行号   一.仅让当前用户显示行号 输入命令:vim ~/.vimrc 写入:set nu 保存:wq ...

  3. Druid出现DruidDataSource - recyle error - recyle error java.lang.InterruptedException: null异常排查与解决

    一.问题回顾 线上的代码之前运行的都很平稳,突然就出现了一个很奇怪的问题,看错误信息是第三方框架Druid报出来了,连接池回收连接时出现的问题. 2018-05-14 20:01:32.810 ERR ...

  4. 杭电1019Least Common Multiple

    地址:http://acm.hdu.edu.cn/showproblem.php?pid=1019 题目: Problem Description The least common multiple ...

  5. cocos2d-x 3.3 引用【#include "cocos-ext.h"】头文件出现编译错误

    添加[#include "cocos-ext.h"] 头文件后报错 f:\projects\test_httpclient\cocos2d\extensions\gui\cccon ...

  6. HTTP服务器(3)

    功能完整的HTTP服务器 导语 这个一个功能完备的HTTP服务器.它可以提供一个完整的文档输,包括图像,applet,HTML文件,文本文件.它与SingleFileHttpServer非常相似,只不 ...

  7. web.xml<context-param>与<init-param>的作用与区别

    <context-param>的作用:web.xml的配置中<context-param>配置作用1. 启动一个WEB项目的时候,容器(如:Tomcat)会去读它的配置文件we ...

  8. 20145321 《Java程序设计》第5周学习总结

    20145321 <Java程序设计>第5周学习总结 教材学习内容总结 第八章 1.Try.catch:Java中所有错误都会被打包为对象,通过try和catch语法可以对代表错误的对象做 ...

  9. 20135320赵瀚青LINUX内核分析第一周学习笔记

    赵瀚青原创作品转载请注明出处<Linux内核分析>MOOC课程http://mooc.study.163.com/course/USTC-1000029000 一.概述 第一周的学习内容主 ...

  10. 安装完kali需要做的一些事情

    1. 没有声音的问题[ kali ] 参考:http://tieba.baidu.com/p/4343219808 用pulseaudio --start会看到一些信息,提示类似root用户之类的 我 ...