Come creare il pulsante Copia sugli appunti in JavaScript

JavaScript è un linguaggio di programmazione web che rende interattivo il nostro sito Web dandogli la possibilità di pensare e agire. Copia sul pulsante degli appunti è una necessità in molti siti Web, ad esempio se hai sviluppato un sito Web che parafrasando le tue frasi o il tuo sito Web è un rimozione del plagio o è un semplice campo di testo che consente all'utente di scrivere online. Per migliorare l'esperienza dell'utente, i siti Web che forniscono alcune informazioni e che le informazioni sono richieste in altre sezioni del sito Web, il sito Web richiede il pulsante Copia a Appunti. Quindi, guardando tutti questi usi, implementamo un programma JavaScript che risponderà alla domanda su come creare il copia negli appunti pulsante in javascript.

Html

HTML è un linguaggio ipertestuale di markup che dà struttura al nostro sito Web. Useremo HTML per creare un campo di input che verrà utilizzato dall'utente per inserire un po 'di testo. Quindi verrà creato un pulsante, che se cliccato copierà tutto ciò che si trova nel campo di input. Alla fine, useremo un tag di script per fare riferimento al file JavaScript che ha il codice JavaScript:

copia

Abbiamo usato il id attributo nel tag di input in modo da poterlo fare riferimento in seguito dal file javascript. Abbiamo anche inizializzato il al clic evento che significa ogni volta che l'utente fa clic su copia pulsante, il HandleClick () la funzione verrà eseguita.

JavaScript

Abbiamo inizializzato una funzione con il nome di HandleClick () in modo che ogni volta che l'utente fa clic sul pulsante di copia, il codice in questa funzione inizierà a eseguire. All'interno della funzione, utilizzando l'attributo ID del campo di input, abbiamo fatto riferimento al campo di input e collegato .Valore alla fine in modo che il valore del campo di input sia memorizzato nell'ingresso variabile. Ora che abbiamo il valore del campo di input, copiamo il valore negli appunti utilizzando il navigatore.Appuntamento.funzione write () in cui passiamo la variabile di input come parametro. Il testo variabile di input viene ora copiato negli appunti. Alla fine, avvisiamo la variabile di input.

funzione handleclick ()
/ * Salva valore di mytext in una variabile di input */
var input = document.getElementById ("MyText").valore;
/ * Copia il testo all'interno del campo di testo */
navigatore.Appuntamento.writeText (input);
Avviso ("Testo copiato:" + input);

Abbiamo inserito il testo Copia nell'articolo degli appunti nel campo di input e ora faremo clic su copia pulsante. Vedremo un avviso che mostra il testo copiato:

Vai a una nuova finestra o a un file Word e premere Ctrl+V che incollerà il Copia nell'articolo degli appunti in quella finestra.

Conclusione

Copia sul pulsante degli appunti è molto utile quando si sta creando un sito Web che utilizza le informazioni da una sezione all'altra, quindi migliorare l'esperienza dell'utente. Copia sul pulsante CLAPPOBOARD è anche un progetto per un principiante che vuole praticare le sue abilità JavaScript.

In questo post, abbiamo implementato la copia sul pulsante degli appunti in JavaScript insieme a screenshot e una GIF.