Evento di triggerszione della selezione automatica della lista popup tramite javascript

Ho precedentemente inserito il valore 1111, 1222 e 1333 in un input di testo HTML. Ora se inserisco 1 nell’input del testo, dovrebbe apparire una lista con il valore 1111, 1222 e 1333 come opzioni disponibili. Come si triggers un evento quando viene selezionata una di queste opzioni?

Ho una funzione javascript che esegue un calcolo sui valori immessi nell’input di testo tramite l’evento “onkeyup”. Funziona molto bene se l’utente inserisce il valore tramite tastiera. Tuttavia, non funziona se l’utente sta selezionando un valore precedentemente inserito dall’elenco popup automatico.

So che possiamo distriggersre l’elenco popup automatico aggiungendo il completamento automatico = “off” al modulo / input di testo. Ma c’è qualche soluzione per farlo funzionare con l’elenco popup automatico? Ho provato tutte le opzioni di eventi disponibili, incluso “onchange”, ma nessuno di questi funziona.

Il codice HTML è molto semplice:

 

Anche la funzione js è molto semplice:

 function update() { var a = $('elem_id_1').value; $('elem_id_2').value = a / 100; } 

Hai provato l’evento onchange ? Non sono sicuro che si attivi per la selezione del completamento automatico, ma potresti anche provare l’evento onpropertychange e verificare la proprietà value:

 textInput.onpropertychange = function () { if (event.propertyName == "value") doCalculation(); } 

Ciò funzionerebbe anche con il tasto destro del mouse su> incolla o con il tasto destro del mouse-> taglia, che non genererebbe il calcolo con il metodo corrente.

MODIFICARE

Sembra che potresti dover utilizzare una combinazione di eventi e timer. Imposta un intervallo sulla messa a fuoco della modifica e cancellala su sfocatura. Userei anche onpropertychange per IE per renderlo più efficiente e mantenere l’evento keyup per renderlo piuttosto veloce.

 //- If it's IE, use the more efficient onpropertychange event if (window.navigator.appName == "Microsoft Internet Explorer") { textInput.onpropertychange = function () { if (event.propertyName == "value") doCalculation(); } } else { var valueCheck, lastValue = ""; textInput.onkeyup = function () { doCalculation(); } textInput.onfocus = function () { valueCheck = window.setInterval(function () { // Check the previous value against (and set to) the new value if (lastValue != (lastValue = textInput.value)) doCalculation(); }, 100); } textInput.onblur = function () { window.clearInterval(valueCheck); } } 

Se la tua routine di calcolo è piccola (come una semplice equazione matematica), lascerei semplicemente il controllo del valore precedente ed eseguirò il calcolo ogni 100ms.