[英]can't get "clipboard.js" to work
我无法让clipboard.js工作; 我认为这是关于整个事情如何运作的一个简单的“误解”,因为我什至无法像这个 Fiddle那样获得最简单的例子来正常工作......
我的具体问题是让它发挥作用:
HTML:
<button class="copyButton"
id="copyButtonId"
data-id="@item.Type"
data-clipboard-action="copy"
data-clipboard-target="#copy_@item.Type">
</button>
应该复制的div是这样的:
<div id="copy_@item.Type">
@item.Type
Name...: @item.Name
Address: @item.Address
</div>`
JS是:
$(function() {
$(document).on("click", ".copyButton", function() {
var clipboard = new Clipboard(".copyButton");
clipboard.destroy();
});
});
我正在进入该功能,但什么也没有发生。 我试过:
clipboard.copy();
但这只是给我一个例外......
我可以得到想要复制的文本
var id= "copy_" + $(this).attr("data-id"); var source = ($("#" + agent).html());
但我应该只能通过使用clipboard.js
来解决它。
我无法让任何示例工作,所以如果有人向我展示一个完整的示例,我会很高兴。 我真的很努力去理解,我可能把整件事想得太多了,让事情变得比现在更复杂。 我不想要任何变通方法,因为我之前使用过它并认为这是一个很棒的 js 解决方案......如果我能理解的话:)
对正确方向的每一个提示都表示赞赏!
确保首先添加正确的库;)
<script src="https://cdn.jsdelivr.net/clipboard.js/1.5.3/clipboard.min.js"></script>
或者你本地的 min.js
我已将您的代码更改为:
<div id="copy">
@item.Type
Name...: @item.Name
Address: @item.Address
</div>
<button class="copyButton" id="copyButtonId" data-id="@item.Type"
data-clipboard-action="copy" data-clipboard-target="div#copy">Copy!</button>
和js:
var clipboard = new Clipboard('.copyButton');
clipboard.on('success', function(e) {
console.log(e);
});
clipboard.on('error', function(e) {
console.log(e);
});
和我一起它现在复制 div。 如果不适合你,请告诉我。
使用 API 数据的情况
import Clipboard from 'clipboard';
''''''
''''''
''''''
var clipboard = new Clipboard('.class_name_of_the_div');
clipboard.on('success', function (event) {});
clipboard.on('error', function (evwnt) {});
data-clipboard-text={data.text}
抱歉,我没有时间阅读所有内容,但您可以使用图书馆https://www.npmjs.com/package/clipboard
import ClipboardJS from 'clipboard'
然后new ClipboardJS('.btn')
或检查此import Clipboard from 'clipboard'
是否特别适用于您的解决方案
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.