Home » Web Development » jQuery » Come riconoscere un tag con .is() di jQuery

Come riconoscere un tag con .is() di jQuery

jquery-logo
Spesso lavorando in javascript capita di voler gestire, con un solo handler jQuery, l’evento su molti elementi del DOM, magari di diverso tipo.

In questa condizione può capitare di voler riconoscere l’elemento sul quale è stato eseguito l’evento javascript. Magari per poter gestire l’evento a seconda del tag in questione. In questo caso ci viene in aiuto la funzione .is() di jQuery.
Mettiamo ad esempio di avere una pagina del tipo:

1
2
3
4
<div id="contenitore">
<h1>Questo è un H1</h1>
<span>Questo è uno span</span>
</div>

Andiamo ad assegnare un handler jQuery per gestire il click ai “figli” del div contenitore, l’h1 e lo span.

1
2
3
$("#contenitore").children().click(function() {
 alert("Hai cliccato sull'elemento");
});

Con il codice nell’esempio andremo a stampare il messaggio “Hai cliccato sull’elemento”, ugualmente sia che si sia cliccato sullo span che sull’h1.
Ma ipotiziamo di di voler riconoscere l’elemento su cui abbiamo cliccato per stampare messaggi diversi. Andiamo quindi a modificare il nostro handler jQuery inserendo un controllo con la funzione .is()

1
2
3
4
5
6
7
$("#contenitore").children().click(function() {
 if($(this).is('h1')){
  alert("Hai cliccato sull'elemento h1");
 }else{
  alert("Hai cliccato sull'elemento span");
 }
});

La funzione .is() di jQuery infatti restituisce true o false a seconda che l’elemento passato sia del tipo richiesto. Quindi va utilizzata nei metodi di controllo come nel nostro esempio.

Resta sempre aggiornato

Stai tranquillo! Non invio E-mail di Spam e non faccio decine di invi ogni settimana. Ti invierò di tanto in tanto un messaggio per tenerti aggiornato sulle novità e sui nuovi articoli!
Email
Secure and Spam free...