Objectifs du blog
Après la lecture de ce blog, vous serez en mesure de savoir comment les données peuvent être copiées dans le presse-papier à l’aide du script java.
Avantage de la fonctionnalité de copie dans le presse-papier
Dans le monde Web actuel, il s'agit de l'utilisateur expérimenté depuis votre site. Au cours de notre travail sur n'importe quel site, nous copions le contenu d'un endroit et le collons à un autre endroit. Il sera vraiment utile à l'utilisateur si un site donne une fonctionnalité de clic à copier. Il enregistre le temps et les efforts de l'utilisateur pour sélectionner et copier le contenu.
Implémentation de la fonctionnalité de copie dans le presse-papier
Voyons comment nous pouvons ajouter cette fonctionnalité:
Étape 1 :
Créez un code HTML avec un paragraphe contenant du contenu et un bouton sur lequel cliquer. Vous pouvez utiliser n’importe quel élément pertinent au lieu d’un paragraphe, par exemple zone de texte, zone de texte, champs masqués, etc.
<body> <p id = "txt_knoband"> KnowBand se vante des meilleurs plug-ins du secteur pour les systèmes de commerce électronique et possède des années d'expérience dans l'utilisation de sites Web de commerce électronique. </ p> <button onclick = "onClickCopy ()"> Copier le texte < / bouton> </ body>
Étape 2 :
Vous devrez créer une fonction onClickCopy () qui copiera les données du paragraphe. La fonction exécutera simplement "document.execCommand (" copy ")" pour copier les données dans le presse-papiers.
function copyOnClick () {var tempInput = document.createElement ("entrée"); tempInput.value = document.getElementById ("txt_knoband"). innerHTML; document.body.appendChild (tempInput); tempInput.select (); document.execCommand ("copie"); document.body.removeChild (tempInput); alert ("valeur copiée"); }
In the last line of the script, we have simply added an alert action to inform the user that the data has been copied.
So finally when you click on the button “Copy Text”, data will be copied to the clipboard and you can simply paste by using CRTL + V.
Related Article: Comment définir Cookie en utilisant JavaScript
