Gestione degli eventi HTML - 2
Come JavaScript può essere utilizzato per gestire gli eventi HTML
Input e Output elements
Un input element è utilizzabile per inserire dati in un documento web.
Un output element è utilizzabile per restituire in un documento web il risultato di un calcolo
Gli elementi input ed output sono normalemnte preceduto e/o segutiti da elementi label.
Nell'esempio che segue inserisco due elementi di imput, "base" e "altezza", ed un elemento di output "area" dove restituire il risultato del calcolo dell'area di un rettantangolo specificato.
Area di un rettangolo
Il campo appena inserito ha l'attributo type = "number" accetta solo numeri. Come posso specificarne il formato? il separatore per le migliaia è il carattere '.' o il carattere ',' ? Dove e come si può specificare?
Area e circonferenza di un cerchio
- Uso campi di input anche per i risultati. Non riesco a controllare per niente il formato dei campi di output.
- raggio non può essere negativo: nel campo di input basta impostare l'attributo min: min="0"
- il valore di piGreco non deve poter essere modificato - basta inserire l'attributo readonly. Lo faccio anche per i campi area e circonferenza.
- per piGreco voglio utilizzare la funzione matematica omonima. C'è una libreria Math. La costante pi greco si ottiene con Math.PI.
- ora voglio limitare le cifre decimali visualizzate. Ci sono una quantità di metodi che consentono di lavorare i numeri. Uso x.toFixed(n).
Prossimi argomenti
Sino ad ora ho visto solo l'evento "click". Voglio gestire anche altri tipi di eventi.
Contemporaneamente, lavorando su questi esempi, mi sono reso conto che la struttura di questi documenti e i relativi css sono piuttosto raffazzonati. Riesco ad ottenere quello che voglio ma in in maniera disordinata. Nel prossimo esempio cercherò di rimediare utilizzando in maniera più appropriata gli elementi strutturali e le proprietà css.