Nelle pagine web, gli eventi sono associati a interazioni con la pagina HTML e il browser. Ad esempio, sono eventi il click del mouse, la pressione di tasti, il caricamento di una pagina o di un elemento. In questa lezione, vediamo come utilizzare gli eventi in jQuery con il metodo .on().
Il metodo .on() è utilizzato per associare uno o più eventi ad uno o più elementi selezionati. È simile a addEventListener() per gli eventi JavaScript, ma è molto più flessibile e personalizzabile.
La sintassi da utilizzare è la seguente:
$(selettore).on(tipoEvento, selettoreFiglio, dati, funzione).
I parametri da utilizzare con .on() in dettaglio:
Vediamo un esempio con .on():
<button id="pulsante">Cliccami</button>
<script>
$(document).ready(function() {
$("#pulsante").on("click", function() {
alert("Hai cliccato il pulsante!");
});
});
</script>Nell'esempio, quando l'utente clicca sul pulsante, avviene un evento di click e compare l'alert di JavaScript.
Nota: puoi trovare tutti i diversi tipi di eventi da utilizzare con .on() nelle prossime lezioni.
Gli eventi si dividono in: