zeno rocha发布了一个专门用于从web页面向本地计算机的剪贴板复制文本的javascript库:clipboard.js。
在每一个github仓库页面的侧边栏上都有一个小部件,用来显示repo的https克隆地址,当你点击紧挨着这个部件的按钮时,就会复制当前repo的url到用户的剪贴板中。github用javascript库zeroclipboard来实现这一功能,问题是这个库是用一个不可见的flash来完成剪贴操作,而flash技术正被各大浏览器厂商冷落,所以势必要有一个新的方案。
在今年的早些时候,firefox浏览器默认禁用了flash,需要用户明确启用flash才可以通过它向剪贴板中复制文本。
mozilla hacks上的一篇文章中示范了api document.execcommand()的使用方法。mdn的文档中称,execcommand“赋予了浏览器通过运行指令操作可编辑区域内容的能力。”直到firefox 41发布,“cut”和“copy”指令才正式启用。
浏览器只允许用户主动触发这样的事件,不允许javascript代码随意将文本复制到剪贴板中,如果代码尝试越过用户自行复制,该调用会失败。
rocha借鉴了一些思路:通过给execcommand传递参数指令来执行相关操作;集成selection api。通过结合这些技术,clipboard.js为开发者提供了一个集成了实用的api的多功能轻量级javascript库。如果想要将按钮与库绑定,开发者需要声明触发剪贴板的元素:
var clipboard = new clipboard('.btn');
主流浏览器都支持这个库,safari目前仍不支持cut和copy指令。
zeroclipboard的开发者在讨论中声称也要在他们的库中加入相同的api的支持,当这些api不被支持时提供向后兼容的flash功能。zeroclipboard的贡献者james green谈起clipboard.js时说到:“它是一个很好的轻量级选择,但是我知道,很多用户的使用环境不是最新的主流浏览器,zeroclipboard在向后兼容flash的同时支持新的html5特性对这些用户来说至关重要。”
html5的剪贴板api的提案仍然处于议程中,在大多数浏览器只实现了部分支持。
全能程序员交流qq群290551701,群内程序员都是来自,百度、阿里、京东、小米、去哪儿、饿了吗、蓝港等高级程序员 ,拥有丰富的经验。加入我们,直线沟通技术大牛,最佳的学习环境,了解业内的一手的资讯。如果你想结实大牛,那 就加入进来,让大牛带你超神!