Comment utiliser querySelector on pour sélectionner un élément d'entrée par son nom?

Question

J'ai récemment reçu de l'aide sur ce site pour utiliser querySelector sur une entrée de formulaire comme select mais dès que j'ai pris <select> il a complètement changé ce qui devait être fait dans la fonction.

HTML:

<form onsubmit="return checkForm()"> 
    Password: <input type="text" name="pwd"> 
    <input type="submit" value="Submit"> 
</form> 

Javascript:

<script language="Javascript" type="text/javascript"> 
    debugger; 
    function checkForm() { 
     var form = document.forms[0]; 
     var selectElement = form.querySelector(''); 
     var selectedValue = selectElement.value; 

     alert(selectedValue); 
</script> 

Avant, je devais ('select') le querySelector, mais maintenant je ne suis pas sûr ce qu'il faut y mettre.
J'ai essayé plusieurs choses ainsi que querySelectorAll mais je n'arrive pas à le comprendre.

Pour être clair, j'essaie de tirer le name="pwd".

Comment est-ce que je pourrais faire ceci?

Answer 1

Vous pouvez essayer 'entrée [name = "passwd"]':

function checkForm(){ 
    var form = document.forms[0]; 
    var selectElement = form.querySelector('input[name="pwd"]'); 
    var selectedValue = selectElement.value; 
} 

un coup d'oeil un ce http://jsfiddle.net/2ZL4G/1/

Answer 2

Ces exemples semblent un peu inefficace. Essayez ceci si vous voulez agir sur la valeur:

<input id="cta" type="email" placeholder="Enter Email..."> 
<button onclick="return joinMailingList()">Join</button> 

<script> 
    const joinMailingList =() => { 
     const email = document.querySelector('#cta').value 
     console.log(email) 
    } 
</script> 

Vous rencontrerez problème si vous utilisez mot-clé this avec de la graisse flèche (=>). Si vous avez besoin de le faire, aller vieille école:

<script> 
    function joinMailingList() { 
     const email = document.querySelector('#cta').value 
     console.log(email) 
    } 
</script> 

Si vous travaillez avec des entrées de mot de passe, vous devez utiliser type="password" il affiche ****** pendant que l'utilisateur est en train de taper, et il est également plus sémantique.