web-dev-qa-db-fra.com

Comment créer un bouton "copier dans le presse-papier" en html/javascript

<html>
<input type="button" id="btnSearch" value="Search" onclick="GetValue();" />
<p id="message" ></p>

<script>
function GetValue()
{
    var myarray= new Array("item1","item2","item3");
    var random = myarray[Math.floor(Math.random() * myarray.length)];
    //alert(random);
    document.getElementById("message").innerHTML=random;
}
</script>

</html>

c'est le code et quand je génère un mot aléatoire disons "item1" montre, comment puis-je ajouter un bouton en dessous que lorsque je clique dessus copie le "item1" 

javascriptjqueryhtml
7
ammartjr

J'ai ajouté quelques lignes à votre code, essayez ça, ça marche!

<html>
<input type="button" id="btnSearch" value="Search" onclick="GetValue();" />
<p id="message" ></p><br>
<button onclick="copyToClipboard('message')">Copy</button>

<script>
function GetValue()
{
    var myarray= new Array("item1","item2","item3");
    var random = myarray[Math.floor(Math.random() * myarray.length)];
    //alert(random);
    document.getElementById("message").innerHTML=random;
}

function copyToClipboard(elementId) {


  var aux = document.createElement("input");
  aux.setAttribute("value", document.getElementById(elementId).innerHTML);
  document.body.appendChild(aux);
  aux.select();
  document.execCommand("copy");

  document.body.removeChild(aux);

}
</script>

</html>

25
selem mn

Vous cherchez le script pour être:

function GetValue()
{
    var myarray = new Array("item1", "item2", "item3");
    var random = myarray[Math.floor(Math.random() * myarray.length)];
    var message = document.getElementById("message");
    message.value = random;
    message.select();
    document.execCommand('copy');
}

L'élément de message doit être un élément sélectionnable, à savoir une entrée de texte ou une zone de texte: <input id="message">

0
bschlueter