Quando si creano pagine, a volte è necessario che quando si fa clic sul pulsante posto nella pagina, nel browser si verifichi qualche evento programmato dall'autore. Per fare ciò, è necessario inserire il codice JavaScript nel documento generato e associarlo al pulsante richiesto. A seconda della quantità di codice necessaria per implementare l'evento previsto, è possibile utilizzare diversi modi per connettere il pulsante al codice.
Istruzioni
Passo 1
Molto spesso, le chiamate al codice JavaScript sono legate all'evento onclick, cioè al clic del pulsante sinistro del mouse. Se non hai bisogno di molto codice per descrivere l'azione che deve essere eseguita, tutto può essere inserito direttamente nel tag del pulsante. Ad esempio, per programmare il browser in modo che mostri un semplice messaggio quando si fa clic su un pulsante, lo script JavaScript avrà il seguente aspetto: alert ('Codice funzionante!') Richiede solo un'istruzione e un testo. Tutto questo può essere facilmente inserito nella descrizione dell'evento onclick del tag del pulsante. In questo caso, il codice HTML più semplice della pagina potrebbe essere simile a questo:
Pulsante con codice
Pulsante con codice
Passo 2
Non è pratico inserire un codice JavaScript più complesso direttamente nel tag del pulsante. È più facile ricavarne una funzione separata e inserire la sua chiamata nell'evento onclick. Ad esempio, potrebbe sembrare una funzione che mostra una finestra contenente l'ora del clic di un pulsante: function getTime() {
var ora = nuova data ();
alert ("Il codice ha funzionato in" + now.getHours () + ":" + now.getMinutes ());
} Dovrebbe essere posizionato nell'intestazione della pagina (tra i tag e). Il codice completo della pagina con una chiamata a questa funzione associata al pulsante potrebbe avere questo aspetto:
Pulsante chiamata funzione
funzione getTime() {
var ora = nuova data ();
alert ("Il codice ha funzionato in" + now.getHours () + ":" + now.getMinutes ());
}
Pulsante chiamata funzione Function
Passaggio 3
Lo stesso metodo dovrebbe essere utilizzato quando si fa clic su diversi pulsanti per generare un evento che può essere descritto con lo stesso codice JavaScript. Ad esempio, è possibile modificare leggermente la funzione precedente per aggiungere l'identificazione del pulsante premuto alla finestra del messaggio: function getTime (btnString) {
var ora = nuova data ();
alert (btnString + "clicked in" + now.getHours () + ":" + now.getMinutes ());
} Il codice completo per una pagina con tre di questi pulsanti potrebbe essere simile a questo:
Tre pulsanti con chiamata di funzione
funzione getTime (btnString) {
var ora = nuova data ();
alert (btnString + "clicked in" + now.getHours () + ":" + now.getMinutes ());
}
Primo pulsante
Secondo pulsante
Terzo pulsante
