根据官方文档的说法这个支持IE9+以及大部分主流浏览器,地址:
https://clipboardjs.com/

下面写个简单的例子:
HTML:注意,这里最好是button,并非所有的元素都支持该JS

<button type="button" class="btn btn-default" id="btn_Share">
复制
</button>

JS:

 //这里以复制URL为例
var clipboard = new ClipboardJS('#btn_Share', {
text: function () {
var url = window.location.href;
return url;
}
}); clipboard.on('success', function (e) {
alert("链接复制成功");
}); clipboard.on('error', function (e) {
alert(e);
});

需要注意的是,官方强调了bootstrap的一个特殊情况
要在Bootstrap Modals中使用或与任何其他更改焦点的库一起使用,您需要将focus元素设置为container值。

new ClipboardJS('.btn', {
container: document.getElementById('modal')
});

ClipboardJS 实现JS复制到剪切板的更多相关文章

  1. [JavaScript] js 复制到剪切板

    zeroclipboard官网:https://github.com/zeroclipboard/ZeroClipboard 下载压缩包,得到两个“ZeroClipboard.js”和“ZeroCli ...

  2. jquery.zclip.js复制到剪切板

    参考http://www.cnblogs.com/PeunZhang/p/3324727.html 需要引用jquery.zclip $("#id").zclip({ path: ...

  3. js 复制到剪切板

    function copyTextToClipboard(text) { var copyFrom = $('<textarea/>'); copyFrom.text(text); $(' ...

  4. 复制到剪切板js代码(转)

    <script type="text/javascript" language="javascript"> //复制到剪切板js代码 functio ...

  5. clipboard.js 实现动态获取内容并复制到剪切板

    使用clipboard.js分为以下几个步骤: 1.引入一个clipboard.js的文件: 2.新建一个clipboard对象: 3.点击按钮获取目标对象里面的内容,将其复制到剪切板. 注意:1.目 ...

  6. js 最简单的实现复制到剪切板 xl_copy

    使用 npm install xl_copy // 项目中安装 import clipboard form 'xl_copy' // 引用 element.onclick = ()=>{     ...

  7. web复制到剪切板js

    web复制到剪切板 clipboard.js 好使!开源项目,下载地址: https://github.com/zenorocha/clipboard.js 使用方法: 引入 clipboard.mi ...

  8. js-将文本复制到剪切板

    // 将文本复制到剪切板 var clipboard2 = new ClipboardJS('.add_wx_guide_float', { text: function(trigger) { ret ...

  9. jquery实现点击复制到剪切板

    1.必须有先引入 jquery库 <script type="text/javascript" src="js/jquery.js"></sc ...

随机推荐

  1. 我Java学习时的模样(三)

    读Java源码 平常使用Java的时候,那些集合类使用起来很顺手,但是有没有想过这些集合内部的实现原理是怎样的,它的添加移除都有哪些操作? 有了一些工作经验之后,必须要读一读Java包中的源码,需要知 ...

  2. HTML 三角符号

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. OGNL与值栈

    一.OGNL入门 1.什么是OGNL OGNL的全称是对象图导航语言(Object-Graph Navigation Language),它是一种功能强大的开源表达式语言.使用这种表达式语言,可以通过 ...

  4. jstl缺包时的报错

    jsp中:<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>  报错: ...

  5. What is the difference between modified duration, effective duration and duration?

    Macaulay Duration (traditionally just called Duration) The formula usually used to calculate a bond' ...

  6. MYSQL连接字符串参数解析(解释)

    被迫转到MySQL数据库,发现读取数据库时,tinyint类型的值都被转化为boolean了,这样大于1的值都丢失,变成true了.查阅资料MySQL中无Boolean类型,都是存储为tinyint了 ...

  7. 总结—angularjs项目

    我毕业了-------有点期待生活,又点害怕生活. 总结下最近一个月做的这个项目,项目的开发形式也比较新颖,采用的是前后端分离的形式.我负责前端的管理系统开发,另一个哥们负责利用ABP创建接口,整合后 ...

  8. MyBatis 指定的转换无效

    表字段Pay类型设置的是float,生成类的属性如下: public double Pay{get;set;} 读取列表时出现如下错误: 错误信息: 查看堆栈跟踪信息, get_Decimal()提示 ...

  9. maven filter不起作用

    遇到的一个坑, spring boot + maven maven fileter没有起作用.spring boot把默认占位符改了 参考:https://blog.csdn.net/mn960mn/ ...

  10. int btn = (Button) findViewById(View.getId());

    int btn = (Button) findViewById(View.getId());//这句话中的btn不能用来和按钮键Button的id号去比较 如果想存储Button,可以这样做: Sta ...