Verwenden von clipboard.js mit generierter PHP-Eingabe

Question

Ich habe keine Erfahrung mit JScript und verwende es nur, wenn es keine andere Option gibt. Aber ich möchte dem Benutzer meiner Website die Möglichkeit geben, einen bestimmten generierten PHP-Code in seine Zwischenablage zu kopieren.

Ich habe den folgenden Code

<?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> 

Aber ich bin gettting diese Fehlermeldung in Console:

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

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

On line 152 von clipboard.js

Was ich tue, falsch ?

Answer 1

Sie haben keine Schaltfläche, deren ID auf btn gesetzt ist, daher gibt getElementById null zurück.

Sie übergeben Null an die Zwischenablage.