示例:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script src="clipboard.min.js"></script>
<!-- Target -->
<textarea id="bar">Mussum ipsum cacilds...</textarea>
<!-- Trigger -->
<button class="btn" data-clipboard-action="cut" data-clipboard-target="#bar">
Cut to clipboard
</button>
<button class="btn" data-clipboard-text="Just because you can doesn't mean you should — clipboard.js">
Copy to clipboard
</button>
<script>
var clipboard = new ClipboardJS('.btn');
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);
});
</script> </button> </body>
</html>

如果不需要任何提示这样就可以了

<button class="btn" data-clipboard-text="这里是复制的文本">
点击复制
</button> <script>
new ClipboardJS('.btn');
</script>

下载地址:https://github.com/zenorocha/clipboard.js

JQ JS复制到剪贴板的更多相关文章

  1. js 复制到剪贴板 兼容还得自己想办法

    clipboard.js https://github.com/zenorocha/clipboard.js/ 主要问题还是ie8, 可以使用ie 特有的方法 if (window.clipboard ...

  2. 【转】js实现复制到剪贴板功能,兼容所有浏览器

    两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...

  3. 【转】js插件zClip实现复制到剪贴板功能

    相信这个功能大家平时上网经常能碰到,以前也没怎么留意怎么实现的,直到项目中需要. 网上一搜一大堆,单纯使用js方法也不是没有,但是由于各浏览器的安全机制不同,不是跨浏览器的.去看了几个常用的网站,都是 ...

  4. 【原】js实现复制到剪贴板功能,兼容所有浏览器

    两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...

  5. 复制到剪贴板的JS实现--ZeroClipboard (兼解决IE下兼容问题)

    复制到剪贴板的JS实现--ZeroClipboard (兼解决IE下兼容问题) 相信绝大多数人都遇到过这样的功能实现,“复制”或者“复制到剪贴板”这样的功能.但是由于各大浏览器的实现方案不一样,导致几 ...

  6. 黄聪:JS实现复制到剪贴板功能,兼容所有浏览器(转)

    两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...

  7. JS实现复制到剪贴板

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  8. js插件zClip实现复制到剪贴板功能

    相信这个功能大家平时上网经常能碰到,以前也没怎么留意怎么实现的,直到项目中需要. 网上一搜一大堆,单纯使用js方法也不是没有,但是由于各浏览器的安全机制不同,不是跨浏览器的.去看了几个常用的网站,都是 ...

  9. js复制内容到剪贴板

    我们web上的复制,有时候尽管可以用鼠标选中,然后复制,但是某些时候,文字不方便选中.因此,我们自定义一个复制按钮,然后通过点击它,把想要的内容复制到剪贴板上.我归纳总结了几种方法: 1.ZeroCl ...

随机推荐

  1. docker的安装及项目部署

    Making Docker and Deployment Process Step: set up your docker environment build a image of activeMQ ...

  2. spring中BeanFactory和FactoryBean的区别

    共同点: 都是接口 区别: BeanFactory 以Factory结尾,表示它是一个工厂类,用于管理Bean的一个工厂 在Spring中,所有的Bean都是由BeanFactory(也就是IOC容器 ...

  3. ASP.NET的路由系统:路由映射

    总的来说,我们可以通过RouteTable的静态属性Routes得到一个基于应用的全局路由表,通过上面的介绍我们知道这是一个类型的RouteCollection的集合对象,我们可以通过调用它的MapP ...

  4. 对mysql数据库中字段为空的处理

    数据库中字段为空的有两种:一种为null,另一种为空字符串.null代表数值未知,空字符串是有值得,只是为空.有时间我们想把数据库中的数据以excel形式导出时 如果碰到字段为空的,为空的字段会被后面 ...

  5. iOS 在 程序内调用手机上安装的地图软件进行导航

    // 需求是需要用户 能从 所在位置 到 附近的健身房的 路线, 然而,就一个需求,不值当的添加一个地图, 就用调用手机上第三方地图软件,  什么高德, 百度, 腾讯, iOS 原生地图都可以, 如果 ...

  6. java常见命名规则

    常见命名规则: 包:类似文件夹,用于把相同的类名进行区分(小写) 单级:例如:student 多级:例如:cn.student 类或者接口: 一个单词:单词首字母大写,例如:Student 多个单词: ...

  7. Confluence 6 数据中心的缓存

    在 Confluence 数据中心(集群)你需要分布缓存和每一个节点的缓存.在集群管理界面,将会定义分布缓存和节点本地缓存. 缓存配置文件存储在集群共享目录中的 home 目录下面. https:// ...

  8. vue 中axios 的基本配置和基本概念

    axios的基本概念及安装配置方法   ajax:异步请求,是一种无需再重新加载整个网页的情况下,能够更新部分网页的技术 axios:用于浏览器和node.js的基于promise的HTTP客户端 a ...

  9. dubbo源码之服务消费

    消费端启动初始化过程: 消费端的代码解析也是从配置文件解析开始的,服务发布对应的<dubbo:service,解析xml的时候解析了一个ServiceBean,并且调用ServiceConfig ...

  10. SQL Server 对字符进行排序(数字类的字符)

    使用的是SQLserver数据库测试,其他数据库类似. 默认排序是按ID进行排序的 select stu_id ,stu_name from student order by stu_id. 现在需要 ...