JavaScript

Copia testo negli appunti

Copia un blocco di testo con messaggio di conferma.

Quando si usa

Per codici, coordinate, indirizzi, IBAN, riferimenti o qualsiasi testo che l'utente deve riutilizzare.

Perché si usa

Riduce gli errori di selezione manuale e rende immediata un'operazione frequente.

Vantaggi principali

  • Uso della Clipboard API
  • Conferma visiva
  • Testo sorgente separato dal pulsante

Anteprima del risultato

Il pulsante consente di copiare rapidamente un testo, ad esempio un frammento di codice o un indirizzo.

www.tastoeffeuno.it

Codice completo

Puoi copiare il frammento e inserirlo in una pagina di prova. Prima della pubblicazione sostituisci i dati dimostrativi con quelli reali.

<p id="testoDaCopiare">www.tastoeffeuno.it</p>
<button id="copia">Copia indirizzo</button>
<p id="esito" aria-live="polite"></p>
<script>
const bottone = document.getElementById('copia');
bottone.addEventListener('click', async function(){
  const testo = document.getElementById('testoDaCopiare').innerText;
  await navigator.clipboard.writeText(testo);
  document.getElementById('esito').innerText = 'Testo copiato';
});
</script>

Da personalizzare: Cambia il contenuto da copiare, il testo del pulsante e la durata del messaggio.

Errore da evitare: La Clipboard API richiede normalmente una pagina HTTPS e può non funzionare in vecchi browser.