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.

Información relacionada

Deja un comentario

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

*