2010-05-13 9 views
4

J'ai une étiquette d'entrée. Cette balise n'a pas la fonctionnalité de saisie semi-automatique désactivée, par conséquent, il n'est pas nécessaire de libérer une clé pour changer la valeur de ce champ et en focaliser une autre. Ma question est: comment puis-je détecter des changements de valeur de ce domaine particulier, comme e. g.HTML Entrée en cas de changement de valeur

<input onvaluechange="//do following..." /> 

L'attribut JavaScript onchange ne se déclenche pas sur le changement de la valeur, que sur les changements comme le flou, mise au point, etc ...

EDIT: Il ne sera pas nécessairement une pression de touche. En raison de l'auto-complétion, l'utilisateur peut simplement cliquer sur le résultat de l'autocomplétion pour modifier la valeur. Cela ne déclencherait pas un événement onkeydown.

Répondre

11

Il ne sera pas nécessairement une pression de touche. En raison de la saisie semi-automatique

... et bien d'autres opérations non fondées clés, tels que le bouton droit sur-couper/coller, glisser-déposer, undo/redo, les ajustements du correcteur orthographique et ainsi de suite.

HTML5 définit un événement oninput pour capturer tous les changements directs.

Malheureusement le support du navigateur n'est pas là (pas de support dans IE, et il y a quelques bugs dans d'autres), donc tout ce que vous pouvez faire si vous avez vraiment besoin de détecter toutes les modifications à une valeur d'entrée antérieure à onchangesetInterval pour ajouter un scrutateur qui compare constamment avec la valeur précédente.

+0

lire ceci à partir du futur, merci beaucoup. –

1

Vous pouvez utiliser l'attribut onKeyPress pour surveiller les changements tapés dans par l'utilisateur.

Par exemple:

<input type='input' onKeyPress='SomeScriptMethod();'> 
+0

Par exemple ...? – Krinkle

+0

Cela ne fonctionnera toujours pas avec la saisie semi-automatique ou lorsque la souris est utilisée pour couper/coller du texte. –

2

J'ai eu un problème similaire et la liaison à une douzaine d'événements différents ne suffit pas de le couper, car il existe tellement de façons différentes de changer la valeur d'entrée, comme bobince noté. Donc, j'ai fini par écrire un plugin de monitoring jQuery simple et mortel, de nature générique. Avec elle, vous pouvez suivre l'évolution de la valeur d'entrée, les changements de texte textarea, les changements de contenu div, etc:

https://github.com/nixd3v/monitor

Suivi des modifications de contenu div:

$.monitor('add', function(){return $("div#someDiv").html()}, function(){ 
    console.log('Div content changed'); 
}); 

valeur d'entrée Suivi des modifications:

$.monitor('add', function(){return $("#password").val()}, function(){ 
    console.log('input value changed'); 
}); 

Il utilise également cependant pas par setInterval, une boucle bien sûr, mais plutôt par l'utilisation de setTimeout avec une fonction anonyme auto-exécution:

(function(){ 
    // do some stuff 
    setTimeout(arguments.callee, 100); 
})(); 

Ce que cela fait - cela garantit que le prochain appel est pas fait avant que votre code a été exécuté.Si vous utilisez l'interrogation dans votre code, c'est la bonne façon de le faire.

+0

Mon respect;) En ce moment, cependant, je n'ai pas accès à un ordinateur sur lequel je pourrais le tester :( – arik

+2

Ce projet github n'existe plus. –

Questions connexes