Использование 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> 

Но я gettting это сообщение об ошибке в консоли:

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

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

В строке 152 clipboard.js

Что я делаю неправильно ?

Answer 1

У вас нет кнопки с идентификатором, установленным в btn, поэтому getElementById вернет значение null.

Вы передаёте null в буфер обмена.