no estoy seguro acerca del método .on()

Estaba usando el método $.click() para desencadenar algunos eventos. Pero luego necesité establecer algunos eventos para algunos elementos HTML antes de que los elementos fueran declarados. Vamos a tomar esto como un ejemplo:no estoy seguro acerca del método .on()

<script> 
    $('div.hide').click(function() { 
     $('div.hide').css({'display' : 'none'}); 
    }); 
</script> 
<div class="hide">some text</div>

La desventaja es que al establecer el método .click(), no existen los elementos div.hide, por lo que no disparo se ajusta.

así que di vuelta al método .on(), así:

<script> 
    $('div.hide').on('click', function() { 
     $('div.hide').css({'display' : 'none'}); 
    }); 
</script> 
<div class="hide">some text</div>

Pero esto también no funciona. Pensé que llamar a .on() haría que todos los elementos div.hide existentes y futuros activen el 'click' function().

Logré superar este inconveniente, pero por mi propio conocimiento, me gustaría saber qué estaba haciendo mal. ¿No hay forma de asignar un activador a futuros elementos HTML?

Mi solituion era:

<script> 
    $(document).ready(function() { 
     $('div.hide').click(function() { 
      $('div.hide').css({'display' : 'none'}); 
     }); 
    }); 
</script> 
<div class="hide">some text</div>

Fuente

2012-06-11 Sorin Buturugeanu

Nota acerca de la '$ (document) ready (function() {});' envoltura, que agrega un controlador de eventos para el evento listo para documentos, de modo que el código dentro no se ejecutará hasta que se desate ese evento. Esto garantiza que la página se represente por completo antes de que se ejecute el script, en lugar de cuando el javascript analiza y ejecuta durante la página de lo contrario. –

se ha perdido la versión de tres argumentos:

$('body').on('click', 'div.hide', function() { ... });

que pone el manejador en el <body> pero las capturas de los eventos que se propagan e invoca el manejador cuando el el elemento objetivo coincide con el selector (el segundo argumento).

El controlador no tiene que ir en el <body>; puede ser cualquier elemento contenedor primario de su <div>.

El método "on" reemplaza los métodos anteriores "en vivo" y "delegar", así como también "bind".

Fuente

2012-06-11 15:35:57 Pointy

Sin embargo, otra razón por la hiper-sobrecarga de 'on' era una mala idea. Siempre uso 'delegate' para delegación y' on' (o uno de sus accesos directos) para no delegación, exactamente por este motivo. –

@ T.J.Crowder sí, realmente no entiendo cuál fue el punto. – Pointy

Creo que el punto importante aquí es que debe adjuntar el evento a algún lugar, y el lugar más CERCANO posible en el DOM es el mejor lugar ideal, por lo que una DIV con una ID en la que se insertan los elementos no existentes sería la mejor . +1 para eso - como OP parece NO entender que el attachement al elemento inexistente todavía NO se adjunta. –

-2

Uso jQuery.live method para conectar un controlador de eventos para todos los elementos que coinciden con el selector de corriente, ahora y en el futuro

Fuente

2012-06-11 15:53:31 Nayjest

El método ".on()", introducido con la versión 1.7, reemplaza al ".l método ive(). De hecho, ".live()" en realidad fue reemplazado por ".delegate()" hace algún tiempo. – Pointy

no estoy seguro acerca del método .on()

Respuesta

Cuestiones relacionadas