ejemplos - Enlazar(keyup) a elementos dinámicos en jQuery(Twitter Bootstrap+typehead)

onkeyup javascript ejemplo

Question

Supongo que algunos de ustedes deben haber fruncido el entrecejo al leer este título ¿eh? Estoy seguro de que la gente pregunta esto cada vez, sin embargo, no he visto mi pregunta en particular, así que lo estoy intentando. Unir eventos a elementos creados dinámicamente es mi kriptonita, simplemente no puedo entenderlo ...

Entonces, estoy usando Twitter Boostrap, con el plugin typehead (). Estoy usando este truco para que funcione con fuentes remotas de datos. En este punto, todo funciona. Hago clic en un ingreso de texto en mi formulario, etiquetado para él, y los scripts van a cargar fuentes externas y aparece el menú desplegable. Pero tengo creación de elementos dinámicos, y has pensado que simplemente no funcionará en ellos. Estaba explorando el método live (), pero al ver "cómo" se disparan los scripts, no estoy seguro de cómo puedo implementarlo.

$(''#anInputField'').typeahead().on(''keyup'', function(ev){
 // stuff happens
});

Cada vez que hay una copia de teclado, la secuencia de comandos dispara una solicitud jSON, verifica sus cosas y devuelve el resultado a typehead () que hace la parte de autocompletar del trabajo. Entonces, ¿cómo puedo decirle a jQuery que mire #aDropdownID creado después del enlace inicial? Continué y verifiqué si podía usar live (), pero como on () lo reemplaza ... ¡no tengo ni idea!

Cualquier ayuda apreciada!

Answer 1

Para que on() pueda delegar tiene que llamarlo a un elemento estático que sabe que siempre estará allí y luego pasar el elemento dinámico como:

$(''#static-parent'').on(''keyup'', ''#aDropdownID'', function(ev){
 // stuff happens
});

Si no tienes un elemento padre estático, entonces siempre puedes usar body .

Answer 2

Esto funciona para mí:

$(document).on(''keyup'', ''#YourInputFieldId'', function () {
    //stuff happens
});