网上文章如何复制粘贴(clipboard.js-复制文本到粘贴板)

简介

将文本复制到剪贴板难度并不是很大, 但最重要的是,它不应该依赖于 Flash 或任何臃肿的框架,这就是 clipboard.js 存在的原因。


安装

// 官网地址:https://clipboardjs.com/ npm install clipboard --save


使用

1、复制输入框的值

<!-- 被复制的目标 --> // value值就是被复制的内容 <input id="foo" value="https://github.com/zenorocha/clipboard.js.git"> <!-- 点击触发 --> // data-clipboard-target指定被复制的目标 <button class="btn" data-clipboard-target="#foo"> <img src="assets/clippy.svg" alt="Copy to clipboard"> </button> <script> new ClipboardJS('.btn') </script>

2、剪切输入框的值

<!-- 被剪切的目标 --> // value值就是被复制的内容 <textarea id="bar">Mussum ipsum cacilds...</textarea> <!-- 点击触发 --> // data-clipboard-target指定被剪切的目标 // data-clipboard-action为cut指定剪切,默认是copy <button class="btn" data-clipboard-action="cut" data-clipboard-target="#bar"> Cut to clipboard </button> <script> new ClipboardJS('.btn') </script>

3、复制其它dom上的值

网上粘贴复制怎么赚钱

// data-clipboard-text指定被复制或剪切的内容 <button class="btn" data-clipboard-text="Just because you can doesn't mean you should — clipboard.js"> Copy to clipboard </button> <script> new ClipboardJS('.btn') </script>


是不是比较简单

觉得效果不错的请帮忙加个关注点个赞,经常分享前端实用开发技巧

您可以还会对下面的文章感兴趣

使用微信扫描二维码后

点击右上角发送给好友