我在做什么
我正在使用clipboard.js将URL复制到剪贴板。
因此,我首先用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
标记后将链接复制到剪贴板。我不明白为什么。
编辑
出于某种原因,这个JS Fiddle显示了我的代码正在工作。不知道为什么它在我的网站上不起作用。
也许您没有使用文档就绪?以下是更多链接的工作解决方案:
$(document).ready(function(){
new Clipboard(".get-link"); // initialize clipboard elements
});
https://jsfiddle.net/j8yLssy9/11/