web-dev-qa-db-fra.com

événement onchange de saisie de texte html

existe-t-il un moyen d'implémenter un événement de modification de texte pour détecter une modification de texte sur un champ de texte de saisie HTML?
.

25
user775187

Lorsque je fais quelque chose comme ça, j'utilise l'événement onKeyUp.

<script type="text/javascript">
 function bar() {
      //do stuff
 }
<input type="text" name="foo" onKeyUp="return bar()" />

mais si vous ne voulez pas utiliser un événement HTML, vous pouvez essayer d'utiliser la méthode jQuerys .change ()

$('.target').change(function() {
   //do stuff
});

dans cet exemple, l'entrée devrait avoir une classe "cible"

si vous souhaitez avoir plusieurs zones de texte que vous souhaitez faire la même chose lorsque leur texte est modifié et que vous avez besoin de leurs données, vous pouvez le faire:

$('.target').change(function(event) {
   //do stuff with the "event" object as the object that called the method
)};

de cette façon, vous pouvez utiliser le même code, pour plusieurs zones de texte utilisant la même classe sans avoir à réécrire aucun code.

32
CaffeinatedCM

onChange ne se déclenche que lorsque vous perdez le focus plus tard. Si vous voulez être vraiment strict avec des changements instantanés de toutes sortes, utilisez:

<input
   type       = "text" 
   onchange   = "myHandler();"
   onkeypress = "this.onchange();"
   onpaste    = "this.onchange();"
   oninput    = "this.onchange();"
/>
35
DragonLord

Eh bien, sauf erreur de ma part, vous pouvez simplement utiliser l'attribut onChange:

<input type="text" onChange="return bar()">

Remarque: dans FF 3 (au moins), cela n'est pas appelé jusqu'à ce que l'utilisateur ait confirmé qu'ils sont modifiés, soit en cliquant loin de l'élément, en cliquant sur entrée, ou autre.

5
Jonathon