Wie kann ich Javascript mit "onclick" in ein Textfeld ausgeben?

Question

Ich schrieb ein Javascript-Programm, um zufällige Passwörter zu generieren. Wie kann ich das Ergebnis in ein Textfeld (Eingabe-Tag) ausgeben?

var randomString = function(length) { 
 
    var text = ""; 
 
    var possible = "!@[|^]µ§$%&?*€#ABCDEFGHIJKLMNOPQRSTVWXYZabcdefghijklmnopqrstvwxyz1234567890"; 
 
    for (var i = 0; i < length; i++) { 
 
    text += possible.charAt(Math.floor(Math.random() * possible.length)); 
 
    } 
 
    return text; 
 
} 
 

 
var rs = randomString(16); 
 
console.log(rs);

<section id="passgen"> 
 
    <button type="button" id="pass-button" onclick="**???**">Generate Password</button> 
 
    <br><br> 
 
    <input type="text" name="output"> 
 
</section>

Answer 1

Sie etwas tun können:

var randomString = function(length) { 
     var text = ""; 
     var possible = "!@[|^]µ§$%&?*€#ABCDEFGHIJKLMNOPQRSTVWXYZabcdefghijklmnopqrstvwxyz1234567890"; 
     for(var i = 0; i < length; i++) { 
      text += possible.charAt(Math.floor(Math.random() * possible.length)); 
     } 
     return text; 
    } 

    var rs = randomString(16); 

    console.log(rs); 

    document.getElementsByName('output')[0].value = rs; 

Answer 2

Es ist keine gute Idee, ein Inline-Klick-Ereignis hinzuzufügen, Sie addEventListener stattdessen verwenden können.

Also hier bin ich der Auswahl zuerst das Element document.getElementById und Anbringen eines click Ereignis für die Verwendung derselben, und später mit document.getElementsByName() ich das Ausgangselement auswählen und die randomisierten String drucken.

Beachten Sie auch die [0], die mit document.getElementsByName() mit bin, ist, weil, wenn der Code mehrere Elemente mit dem Namen output begegnet, wir die erste wählen, da es eine Reihe von abgestimmten Elementen zurückgibt. Es wird großartig sein, wenn Sie id zum Feld input hinzufügen und dann document.getElementById() verwenden können, um ein bestimmtes Element auszuwählen.

var randomString = function(length) { 
 
    var text = ""; 
 
    var possible = "!@[|^]µ§$%&?*€#ABCDEFGHIJKLMNOPQRSTVWXYZabcdefghijklmnopqrstvwxyz1234567890"; 
 
    for (var i = 0; i < length; i++) { 
 
    text += possible.charAt(Math.floor(Math.random() * possible.length)); 
 
    } 
 
    return text; 
 
} 
 

 
document.getElementById('pass-button').addEventListener('click', function() { 
 
    document.getElementsByName('output')[0].value = randomString(16); 
 
});

<section id="passgen"> 
 
    <button type="button" id="pass-button">Generate Password</button> 
 
    <br> 
 
    <br> 
 
    <input type="text" name="output"> 
 
</section>

Answer 3

Sehr einfache document.getElementById("id_of_input_field").value = rs; oder sonst können Sie Namen Eingabefeld verwenden document.getElementsByName('output')[0].value = rs;

Answer 4

var randomString = function(length) { 
 
     var text = ""; 
 
     var possible = "!@[|^]µ§$%&?*€#ABCDEFGHIJKLMNOPQRSTVWXYZabcdefghijklmnopqrstvwxyz1234567890"; 
 
     for(var i = 0; i < length; i++) { 
 
      text += possible.charAt(Math.floor(Math.random() * possible.length)); 
 
     } 
 
     return text; 
 
    } 
 

 
var generatePassword = function(length) { 
 
document.getElementById('password').value = randomString(length); 
 
}

<section id="passgen"> 
 
<button type="button" id="pass-button" onclick="generatePassword(16)">Generate Password</button> 
 
<br><br> 
 
<input id='password' type="text" name="output"> 
 
</section>

Answer 5

Geben Sie Ihre Eingabe einer ID zum Ziel, dann gilt:

document.getElementById('yourInputID').value = rs;