利用clipboard.js复制粘贴JS插件实现页面特定文本按钮复制

我们在设计网站的时候,有些效果需要不断的提高用户体验。比如我们在页面中的微信号、电话号码、优惠码等信息,最好不要用户直接复制。如果能直接点击按钮直接复制效果还是比较好体验的。这里我们可以使用clipboard.js复制粘贴JS插件实现。

微信号 : laobuluo 添加 $(document).ready(function(){ var clipboard = new Clipboard(\'#copy_btn\'); clipboard.on(\'success\', function(e) { alert(\"微信号:laobuluo 复制成功\",1500); e.clearSelection(); console.log(e.clearSelection); }); });

这个仅仅是简单的示范,光有这个代码还是不行的,我们还需要最为主要的2个JS文件。

jquery.min.js

clipboard.min.js

我们需要下载且引用到网站中。

网盘下载(提取码:8m2j)

这里本站有备份下载,我们也可以从官方库下载JS。具体引用到网站,我们需要调整CSS。

推荐站内搜索:万网备案域名、shopex主机、购买域名和空间、独立ip、网站ip查询、域名备案查询、服务器香港、网站备案号查询、域名空间购买、如何查询域名备案号、