JavaScript ci permette di gestire degli eventi legati ai tasti del mouse, in particolare l’evento – onClick – si attiverà al click del tasto sinistro del mouse.
Vediamo come incorporare il codice nella pagina web:
<!DOCTYPE html>
<html>
<head>
<title>Titolo del documento</title>
<script>
function miaFunzione()
{
alert("Hai cliccato sul pulsante!");
}
</script>
</head>
<body>
<p>Clicca il bottone per vedere l'effetto.</p>
<button onclick="miaFunzione()">Cliccami</button>
</body>
</html>
Come si può notare nel codice sopra la sintassi corretta è la seguente:
In HTML:
<button onclick="miaFunzione()">Cliccami</button>
– al tag bottone – button – assegno l’evento JS – onclick – che al click con il tasto Sx del mouse richiamerà la funzione – miaFunzione -.
In JS:
<script>
function miaFunzione()
{
alert("Hai cliccato sul pulsante!");
}
</script>
– creo la funzione che verrà richiamata da – onclick – del tag – button –
– all’interno delle parentesi graffe inserisco i comandi che la funzione andrà ad eseguire.
– il comando – alert(“Hai cliccato sul pulsante!”); – aprirà una finestra di sistema di tipo – alert – con un messaggio di avviso.
onclik può essere applicato a tutti elementi HTML ad eccezione di:
<base> <bdo> <br> <head> <html> <iframe> <meta> <param> <script> <style> <title>
L’effetto finale si può vedere qui sotto:
Clicca il bottone per vedere l’effetto.
