web-dev-qa-db-fra.com

Comment passer du texte dans une zone de texte à une fonction JavaScript?

Supposons que j'ai le code HTML suivant, comment puis-je passer l'entrée de l'utilisateur pour exécuter la fonction JavaScript (str) en tant qu'argument?

<body>

<input name="textbox1" type="text" />
<input name="buttonExecute" onclick="execute(//send the user's input in textbox1 to this function//)" type="button" value="Execute" />

</body>
javascripthtmljavascript-events
22
natch3z

Vous pouvez soit accéder à la valeur de l'élément par son nom:

document.getElementsByName("textbox1"); // returns a list of elements with name="textbox1"
document.getElementsByName("textbox1")[0] // returns the first element in DOM with name="textbox1"

Alors:

<input name="buttonExecute" onclick="execute(document.getElementsByName('textbox1')[0].value)" type="button" value="Execute" />

Ou vous affectez un ID à l'élément qui l'identifie ensuite et vous pouvez y accéder avec getElementById:

<input name="textbox1" id="textbox1" type="text" />
<input name="buttonExecute" onclick="execute(document.getElementById('textbox1').value)" type="button" value="Execute" />
30
Gumbo

Au lieu de passer le texte en tant que variable, vous pouvez utiliser le DOM pour extraire les données de votre fonction:

var text = document.getElementsByName("textbox1").value;
14
David Robbins

Vous pouvez simplement obtenir la valeur d'entrée dans l'événement onclick comme suit:

onclick="execute(document.getElementById('textbox1').value);"

Vous devrez bien sûr ajouter un identifiant à votre zone de texte

2
peirix

document.getElementById ('textbox1'). value

1
erikkallen

C'est ce que j'ai fait. (Adapté de toutes vos réponses)

<input name="textbox1" type="text" id="txt1"/>
<input name="buttonExecute" onclick="execute(document.getElementById('txt1').value)" type="button" value="Execute" />

Ça marche. Merci à tous. :)

1
natch3z

Vous pouvez obtenir la valeur textbox et l'ID à l'aide de l'exemple simple suivant dans la programmation dotNet

<html>
        <head>
         <script type="text/javascript">
             function GetTextboxId_Value(textBox) 
                 {
                 alert(textBox.value);    // To get Text Box Value(Text)
                 alert(textBox.id);      // To get Text Box Id like txtSearch
             }
         </script>     
        </head>
 <body>
 <input id="txtSearch" type="text" onkeyup="GetTextboxId_Value(this)" />  </body>
 </html>
0
Ayaat Shifa