Evento Textbox Javascript

Question

Sono di fronte a problemi con il tipo di testo di input (ad es. Casella di testo).

Ho scritto una funzione utilizzata dall'evento onkeyup in una casella di testo. La linea si presenta così:

<input type='TEXT' value='abc' onkeyup='changeSomething(this);'> 

Ma ora sto affrontando problema che quando l'utente seleziona i valori dai valori inseriti in precedenza, sto non ottenere ogni caso quando l'utente seleziona i valori inseriti in precedenza dal menu a tendina (modifica: credo che si riferisca al completamento automatico del browser qui).

Qualcuno ha una soluzione per questo? :)

Answer 1

uso onchange anziché onkeyup in questo caso

veda: http://www.w3schools.com/jsref/event_onchange.asp

esempio

<input type='text' value='abc' onchange='changeSomething(this);' /> 

Per ovviare a questo

EDIT due cose:
1) I valori di completamento automatico possono essere selezionati usando i tasti freccia e inserire/scheda, e utilizzando il mouse. I tasti freccia/enter.tab attivano gli eventi onkeyup ... facendo clic nella casella di completamento automatico, tuttavia, non viene attivato l'evento onclick.
2) L'evento onchange scatta non appena lo stato attivo viene perso SE il contenuto è cambiato. La messa a fuoco non viene persa quando si selezionano i valori di completamento automatico.

In sostanza, non sembra esserci alcun modo per garantire ragionevolmente che l'evento venga elaborato nel modo desiderato.

Prima di tutto, hai davvero bisogno di ascoltare ogni tasto? In secondo luogo, sarebbe meglio servire disattivando il completamento automatico? (ad esempio <input type='text' value='abc' autocomplete='off' onkeyup='changeSomething(this);' />)

Answer 2

Ecco una soluzione che i sondaggi l'elemento periodicamente per eventuali modifiche

<script type="text/javascript"> 

var changeWatcher = { 
    timeout: null, 
    currentValue: '', 
    watchForChange: function(el) { 
     if(el.value != this.currentValue) { 
      this.changed(el); 
     } 
     this.timeout = setTimeout(function() { 
      changeWatcher.watchForChange(el) 
     }, 200); 
    }, 
    cancelWatchForChange: function() { 
     clearTimeout(this.timeout); 
     this.timeout = null; 
    }, 
    changed: function(el) { 
     this.currentValue = el.value; 
     // do something with the element and/or it's value 
     //console.log(el.value); 
    } 
} 

</script> 
<input type='text' value='abc' onfocus='changeWatcher.watchForChange(this)' onblur='changeWatcher.cancelWatchForChange()' onchange='changeWatcher.changed(this)' />