javascript - 将 clipboard.js 与生成的 PHP 输入结合使用

Question

我没有使用 JScript 的经验，也没有其他选择时只使用它。但我希望我网站的用户可以选择将特定生成的 PHP 代码复制到他的剪贴板中。

我有以下代码

<?php 
    echo'<button class="btn" data-clipboard-text="'. htmlspecialchars("<pre><code>", ENT_HTML5) . $newText . htmlspecialchars("</code></pre>", ENT_HTML5) .'">Copy to Clipboard</button>';
?>
<script src="./clipboard.js"></script>
<script>
    var btn = document.getElementById('btn');
    var clipboard = new Clipboard(btn);
    clipboard.on('success', function(e) {
        console.log(e);
    });
    clipboard.on('error', function(e) {
        console.log(e);
    });
</script>

但我在控制台中收到此错误消息:

TypeError: First argument must be a String, HTMLElement, HTMLCollection, or NodeList

throw new TypeError('First argument must be a String, HTMLElement, HTMLCollectio...

在clipboard.js的第152行

我做错了什么？

Answer 1

您没有将 id 设置为 btn 的按钮，因此 getElementById 将返回 null。

您正在将 null 传递给剪贴板。