Las funciones de jQuery delegate() y undelegate() quedaron obsoletas en la versión 1.7 de jQuery. Estas funciones asignan y eliminan eventos en los elementos del DOM.
En este post vamos a ver su sintaxis y ejemplos para sustituirlas por las funciones on() y off() que son las validas a partir de la 1.7.
Este mismo caso ocurre con las funciones bind – unbind() y live() – die().
Os recomiendo leer el post ‘jQuery on() y off(): Asignar de eventos a elementos del DOM‘ para ver el potencial de estas 2 funciones.
Con jQuery delegate() podemos asignar por defecto eventos a los diferentes elementos que tenemos en el DOM.
Vamos con las diferentes sintaxis que podemos usar extraídas de su web oficial:
$(selector).delegate(selectorDeNodo,evento,parametros,funcion)
Os explico los parámetros de la función:
Con undelegate() eliminamos los eventos asignados previamente a los elementos del DOM, veamos su sintaxis extraída de su web oficial:
$(selector).undelegate(selector2,evento,funcion)
Repasemos la sintaxis:
Vamos a ver con este ejemplo cómo cambiar de una función a otra:
$(document).ready(function(){ $("body").delegate("#boton","click", function(){ alert('Has hecho click en el botón de jQuery delegate()'); }); $("#boton2").on("click",function(){ alert('Has hecho click en el botón de jQuery on()'); }); });
Os explico el ejemplo:
El código HTML de los botones es este:
<input type="button" name="boton" id="boton" value="Clíckame"> <input type="button" name="boton2" id="boton2" value="Clíckame">
Vamos a ver con estas 2 líneas de código cómo migrar de una función a otra:
$("body").undelegate("#boton","click"); $("body").off("click", "#boton" );
He realizado el ejemplo para eliminar el evento del ejemplo de delegate() y su equivalente con off().
Para la detección, control o selección de elementos con jQuery os recomiendo leer este post: