Pourquoi l'événement javascript onchange ne se déclenche-t-il pas si la saisie semi-automatique est activée?

Question

J'ai une zone de texte avec un événement onchange. Pourquoi cet événement ne se déclenche-t-il pas lorsque l'utilisateur utilise la fonctionnalité de saisie semi-automatique pour remplir la zone de texte?

Je travaille avec Internet Explorer. Existe-t-il une solution standard et relativement simple pour contourner ce problème, sans que je doive désactiver la fonctionnalité de saisie semi-automatique?

Answer 1

La dernière fois que j'ai eu ce problème, j'ai fini par utiliser l'événement onpropertychange pour Internet Explorer à la place. J'ai lu à ce sujet here on MSDN: c'est la façon recommandée de contourner le problème.

Answer 2

J'ai déjà rencontré cette fonctionnalité gênante et ma solution consistait alors à utiliser l'événement onfocus pour enregistrer la valeur actuelle de la zone de texte, puis à utiliser l'événement onblur pour vérifier si la valeur actuelle correspond à la valeur enregistré pendant onfocus. Par exemple

<input type="text" name="txtTest" value="" onfocus="this.originalvalue=this.value" onblur="if (this.value != this.originalvalue) alert('Test has changed')"/> 

Answer 3

Je viens juste de Autocomplete pour les zones de texte que je dois déclencher un événement de changement de texte

'Turn off Auto complete 
'(it needs to fire the text change event) 
txtYourTextBox.Attributes.Add("AutoComplete", "off") 

Il suffit de le mettre dans la charge de page.

Alternativement, vous pouvez ajouter l'attribut à votre balisage sur l'élément input ou l'ensemble form:

<input type=text autocomplete=off> 

ou

<form autocomplete=off> 

Answer 4

Je viens de découvrir que using jQuery 1.4 to set change event peut résoudre ce problème. Il semble que ce soit la solution la plus simple si vous connaissez déjà jQuery.

Answer 5

Miser sur la réponse de Tim C, ici est le simple jquery je suis venu avec pour gérer cela pour toutes les zones de texte sur une page:

$("input[type=text]").bind("focus change",function(){ 
    this.previousvalue = this.value; 
}).blur(function(){ 
    if (this.previousvalue != this.value){ 
     $(this).change(); 
    } 
}) 

Si vous ne se soucient pas onchange tirer plusieurs fois, vous peut le rendre plus simple:

$("input[type=text]").blur(function(){ 
    $(this).change(); 
}) 

Answer 6

Je trouve que le JavaScript jQuery (v1.10 +) suivant fonctionne dans le cas d'un texte en cours d'achèvement automatique des champs de saisie de texte HTML. Cela a été testé pour fonctionner de manière fiable au moins dans Safari 6.1.1 sous Mac OS X 10.8.5, mais devrait fonctionner dans d'autres navigateurs conformes aussi:

$("input:text[id=text_field_id]").bind("focus change keyup blur", function(event) { 
// handle text change here... 
}); 

Il semblait l'ajout du gestionnaire d'événements blur était la clé ce travail est effectué, bien que les autres gestionnaires d'événements aident à s'assurer que le gestionnaire d'événements est appelé chaque fois que le texte change, que ce soit en raison d'une modification ou d'une nouvelle entrée de la fonction d'auto-complétion du navigateur.

remplace simplement le code ci-dessus "input:text[id=text_field_id]" avec le sélecteur pertinent pour votre champ de saisie de texte souhaité, ou si vous utilisez l'attribut id pour faire référence à votre domaine, remplacez text_field_id avec id la valeur d'attribut de votre champ de texte.