javascript 无法让“clipboard.js”工作
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/33939898/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
can't get "clipboard.js" to work
提问by marS
I can't get the clipboard.jsto work; I think it's a simple "misunderstanding" about how the whole thing works, since I'm not even able to get the most simple example to work properly like in this Fiddle...
我无法让clipboard.js工作;我认为这是关于整个事情如何运作的一个简单的“误解”,因为我什至无法获得最简单的例子来像这个 Fiddle一样正常工作......
My specific problem is getting this to work:
我的具体问题是让它发挥作用:
HTML:
HTML:
<button class="copyButton"
id="copyButtonId"
data-id="@item.Type"
data-clipboard-action="copy"
data-clipboard-target="#[email protected]">
</button>
The div that should be copied is this:
应该复制的div是这样的:
<div id="[email protected]">
@item.Type
Name...: @item.Name
Address: @item.Address
</div>`
The JS is:
JS是:
$(function() {
$(document).on("click", ".copyButton", function() {
var clipboard = new Clipboard(".copyButton");
clipboard.destroy();
});
});
I'm getting into the function, but nothing is happening. I tried:
我正在进入该功能,但什么也没有发生。我试过:
clipboard.copy();
but that just throws me an exception...
但这只是给我一个例外......
I can get the text, that I want to copy
我可以得到想要复制的文本
var id= "copy_" + $(this).attr("data-id");
var source = ($("#" + agent).html());
var id= "copy_" + $(this).attr("data-id");
var source = ($("#" + agent).html());
But I should be able only to work it out by using clipboard.js
.
但我应该只能通过使用clipboard.js
.
I can't get any examples to work, so I would be happy if someone shows me a complete example. I've really tried to understand and I may be overthinking the whole thing and making this more complicated than it is. I don't want any workarounds, as I used that before and think this is a great js-solution... If I could just understand it :)
我无法让任何示例工作,所以如果有人向我展示一个完整的示例,我会很高兴。我真的很努力去理解,我可能把整件事想得太多了,让事情变得比现在更复杂。我不想要任何变通方法,因为我之前使用过它并认为这是一个很棒的 js 解决方案......如果我能理解的话:)
Every hint into the right direction is appreciated!
对正确方向的每一个提示都表示赞赏!
回答by Victoria S.
Make sure you add the right library first ;)
确保首先添加正确的库;)
<script src="https://cdn.jsdelivr.net/clipboard.js/1.5.3/clipboard.min.js"></script>
<script src="https://cdn.jsdelivr.net/clipboard.js/1.5.3/clipboard.min.js"></script>
Or your local min.js
或者你本地的 min.js
I've altered your code to this:
我已将您的代码更改为:
var clipboard = new Clipboard('.copyButton');
clipboard.on('success', function(e) {
console.log(e);
});
clipboard.on('error', function(e) {
console.log(e);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/clipboard.js/1.5.3/clipboard.min.js"></script>
<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>
With me it copies the <div>
now. Let me know if it doesn't for you.
对我来说,它复制了<div>
现在。如果不适合你,请告诉我。