En jQuery 1.3, el equipo introdujo el método live (), que nos permite vincular los controladores de eventos a los elementos de la página, así como a cualquiera que pueda crearse en el futuro de forma dinámica. Aunque no es perfecto, definitivamente resultó ser útil. En particular, live () burbujea hasta el final, y adjunta el controlador al documento. También deja de funcionar bien cuando se encadena el método, desafortunadamente. Delegate () se introdujo en la versión 1.4, que hace casi lo mismo, pero de manera más eficiente.
Examinaremos las diferencias específicas entre los dos métodos en el consejo rápido del video de hoy. Gracias a la extensión FireQuery Firebug, tendremos las herramientas para entender más fácilmente cómo funciona cada método..
Opciones de visualización alternativas
Screenr (MP4)
Haz click en mi
// Enlazar adjunta un controlador de eventos solo a los elementos // que coinciden con un selector en particular. Esto, como es de esperar, // excluye cualquier elemento generado dinámicamente. $ ("# items li"). click (function () $ (this) .parent (). append ("
Elemento nuevo
");); // Live (), introducido en 1.3, permite el enlace // de los controladores de eventos a todos los elementos que coinciden con un // selector, incluidos los creados en el futuro. // Lo hace adjuntando el controlador del documento. // Desafortunadamente, no funciona bien con el encadenamiento. // No espere encadenar live () después de llamadas como // children (). next ()… etc. $ ("li"). live ("click", function () $ (this) .parent (). append ("
Elemento nuevo
");); // Delegate, nuevo en la versión 1.4, tal vez debería haber sido // un reemplazo completo de Live (). Sin embargo, ¡obviamente // habría roto muchos códigos! Sin embargo, // delegar remedios muchos de las fallas // encontradas en live (). Adjunta el controlador del evento // directamente al contexto, en lugar del documento. // Tampoco sufre los problemas de encadenamiento // que sí lo hace. Hay muchos beneficios de rendimiento // para usar este método en vivo (). $ ('# items'). delegate ('li', 'click', function () $ (this) .parent (). append ('
Elemento nuevo
'); ); // Al pasar un elemento DOM como el contexto de nuestro selector, podemos hacer que // Live () se comporte (casi) de la misma manera que lo hace el delegado () //. Adjunta el controlador al contexto, no // el documento, que es el contexto predeterminado. // El siguiente código es equivalente a la versión de delegado () // que se muestra arriba. $ ("li", $ ("# items") [0]). live ("click", function () $ (this) .parent (). append ("
Elemento nuevo
"););
Conclusión
Esto definitivamente puede ser un tema confuso. Por favor siéntase libre de hacer preguntas, o discutir dentro de los comentarios. Muchas gracias a Elijah Manor por aclararme algunas cosas sobre este tema.!
Share
Accentsconagua
