El método on() consiste en:
Adjuntar uno o más controladores de eventos para los elementos seleccionados y los elementos secundarios.
Algo como esto:
$("p").on("click", function(){
console.log("Has hecho click en el párrafo!.");
});
Y el script se ejecutara con cada “click” que hagamos sobre el elemento que hayamos definido. En este caso la etiqueta P. Todos los párrafos que haya en el documento.
Pero qué pasa si nos equivocamos y escribimos one, en vez de on?. Que también es otro método de jQuery pero con distinta funcionalidad.
Se ejecutará al menos, una vez.
$(".my-class").one("keyup", function(){
var query = $(this).val();
//Instr
});
Y esto, puede dejarnos en jaque. Ya que, si estamos montando un buscador, donde el usuario teclea varias veces, sólo funcionara la primera vez que pulse una tecla. Si se recarga la página, volvería a ejecutarse una vez.
Así que, vistas las diferencias de cada método, ya podemos tener claro como enfocar los casos que se nos presenten.
Por un error de sintaxis, podemos generar un auténtico caos en nuestro script. Y aunque one() es otro método de jQuery, no es el propósito que queríamos conseguir.