只能在第二次点击时复制到剪贴板

时间:2016-04-16 02:13:10

标签: javascript php clipboard.js

我在做什么

我使用clipboard.js将网址复制到剪贴板。

所以我首先在PHP中渲染一些HTML。代码看起来像这样:

$copyToClipboard = "copyToClipboard(".$id.");";
echo "<a id='get-link-$id' class='small-button get-link' onclick='$copyToClipboard' data-clipboard-text='myText'><u>Get Link</u></a>";

这是在我的<script>标记之前的页面顶部完成的。

以下是我在剧本中的内容:

new Clipboard(".get-link"); // initialize clipboard elements
$(function() {
    new Clipboard(".get-link"); // initialize clipboard elements
});

function copyToClipboard(id) {
    new Clipboard(".get-link");
    new Clipboard("#get-link-" + id);
    $("#get-link-" + id).text("Copied!");
    setTimeout(function(){ $("#get-link-" + id).text("Get Link"); }, 2000);
}

我正在冗余地使用new Clipboard(".get-link");来努力使其发挥作用。

所有这些代码都是将链接复制到剪贴板,然后将文本更改为2秒,然后将其更改回来。

问题

仅在第二次点击a标记后将链接复制到剪贴板。我无法弄清楚原因。

修改

出于某种原因,this JS Fiddle显示我的代码正常运行。不知道为什么它在我的网站上不起作用。

1 个答案:

答案 0 :(得分:0)

也许你没有准备好文件?以下是更多链接的工作解决方案:

$(document).ready(function(){
    new Clipboard(".get-link"); // initialize clipboard elements
});

https://jsfiddle.net/j8yLssy9/11/