Asignar acción en jquery a múltiples enlaces

En muchas ocasiones nos interesa que al clicar sobre los enlaces de un apartado, el que sea, se ejecute una acción determinada. Pongamos un ejemplo:

Tengo un submenú en la parte izquierda con varios enlaces. Al clicar sobre alguno de ellos, queremos que muestre una ventana modal. Tenemos dos opciones, o aplicamos uno a uno la acción a realizar sobre cada enlace o:

Asignamos a todos los enlaces que nos interese una clase, en nuestro ejemplo .linkaccion

1
2
3
4
<a href="enlace1.html" class="linkaccion">Enlace 1</a>
<a href="enlace2.html" class="linkaccion">Enlace 2</a>
<a href="enlace3.html" class="linkaccion">Enlace 3</a>
<a href="enlace4.html" class="linkaccion">Enlace 4</a>

Ahora entra en acción jQuery asignando a todos los enlaces con la clase .linkaccion la función script deseada:

1
2
3
4
5
var btnAccionClick = function(e){
    alert("Boton clicado: "+ e.currentTarget.id);
}
 
$('.linkaccion').on('click', btnAccionClick);

Como veréis tenemos la función btnAccionClick() por un lado. Por otro a todos los enlaces con clase .linkaccion le asignamos dicha función que se ejecutará al clicar.

Artículos relacionados

jQuery – Traducir hora española a inglesa Es muy común tener en un textbox de un formulario una fecha en español DD/MM/YYY, y queramos convertirla al formato inglés YYYY/MM/DD para poder traba...
jQuery Plugin MiniJS Notification – Muestra ... Os facilito un enlace a un magnífico plugin que os facilitará la tarea de poner mensajes en vuestra web o aplicación. Un ejemplo claro, sería la oblig...
Primer contacto con jQuery Como indican en la web oficial, jQuery es una librería para JavaScript que facilita la programación en las tareas de eventos, crear animaciones y efec...
jQuery como seleccionar una opción de Select Código muy práctico para utilizarlo una vez recibimos datos vía AJAX y debemos seleccionar una de las opciones: Tarragona Albacete Castellón A...

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

*