万能的“一键复制到剪贴板”,支持IE、火狐、谷歌及移动版浏览器

万能的“一键复制到剪贴板”,支持IE、火狐、谷歌及移动版浏览器

   说到点击按钮“复制到剪贴板",大家都可能用过,但是之前的实现方不是只支持某些浏览器,就是要在网页内嵌swf(Flash)文件。

   这两种方法:第一种不能很好的兼容多数浏览器,第二种方式下开发人员可能会担心Flash的安全性问题。

   现在出现了一种新的实现方式:clipboard.js。只要给页面引入一个js文件,并且在页面上做一定处理,就可
   实现全浏览器兼容的“一键复制到剪贴板”的功能。

目录

  • 万能的一键复制到剪贴板支持IE火狐谷歌及移动版浏览器
      • 目录
  • clipboardjs
    • 下载clipboardjs
    • 使用clipboardjs
    • 不止是复制还有更多
    • 浏览器支持
    • 以防万一
    • 脚注

clipboard.js

无需Flash,无需框架;
仅需3KB的压缩版JS ,就可实现华丽的剪贴板复制操作 —— [clipboardjs.com]

clipboard.js是一个轻量级的“一键复制到粘贴板”工具,您只需要将其引入您的项目,并在对应位置调用即可。

下载clipboard.js

最直接的方式就是进入官方主页下载
或者直接点击https://github.com/zenorocha/clipboard.js/archive/master.zip。

使用clipboard.js

clipboard.js现在可支持文本框text和文本域text area两种方式的粘贴板复制:

1. 使用文本框作为复制内容的来源

(1).在你的页面引入clipboard.js1

中加入这个:

alert(Clipboard.isSupported()); 

如果弹出true,那么你就可以放心大胆地使用clipboard.js在你的项目中了。


脚注


  1. 这里使用的是官方给的链接. ↩
  2. 这里使用的是官方给的链接. ↩
  3. 这里使用的是官方给的链接. ↩

你可能感兴趣的:(javascript,系统剪贴板,web前端)