Corso javascript per scuola media

I pulsanti

data di oggi:

Classe 2^a della scuola secondaria di 1° grado


Zitto!	Parla!

Corso di Javascript

Oggi vediamo l'uso dei contatori. Esaminiamo il seguente quiz:

La malleabilità di un materiale è:
la proprietà di cedere facilente alle idee altrui.
la proprietà di essere ridotti in lamine sottili.
la proprietà di essere facilmente ridotti in fili sottili.

In questo quiz appaiono tre pulsanti di comando , , sui quali occorre premere col sinistro del mouse. Dei tre pulsanti uno solo rappresenta una risposta esatta, mentre gli altri due rappresentano una risposta sbagliata.

Costruiamo ora un piccolo programma in javascript misto html che consenta all'utente di rispondere alla domanda e di ottenere la conferma quando la risposta è quella giusta. La istruzione che crea un pulsante è la seguente:

dove:

input type="button"

micrea un pulsante; mentre:

value=" A "

mi dice la che cosa devo scrivere sul pulsante; nel nostro caso scrive: A.

Analogamente per il pulsante la istruzione è:

Per il pulsante la istruzione è:

Esercizio

Scrivere un programma di tecnologia che mi dica la risposta esatta alla seguente domanda:

La malleabilità di un materiale è:
la proprietà di cedere facilente alle idee altrui.
la proprietà di essere ridotti in lamine sottili.
la proprietà di essere facilmente ridotti in fili sottili.

Soluzione

Procediamo con ordine.

rotolo di alluminio

Intanto vediamo quale è la risposta giusta; la risposta giusta è la , in quanto la malleabilità è appunto la proprietà dei metalli di essere ridotti in lamine sottili.

Detto questo passiamo alla scrittura del programma in javascript.

Che cosa ci serve?

Intanto ci serve un pulsante di comando; lo possiamo costruire facilmente con la seguente istruzione:

Sul pulsante viene scritta la lettera A; quando l'utente clicca con il mouse, con la funzione errata() che costruiremo dopo, controlleremo se la risposta è giusta.

Si tratta ora di scrivere la funzione errata().

Intanto completiamo quello che deve essere scritto dopo il pulsante nel seguente modo:

<input type="button" value=" A " onclick="errata()" > la proprietà di cedere facilente alle idee altrui.<br>

che l'utente vedrà cosi:

la proprietà di cedere facilente alle idee altrui.

cioè il pulsante seguito da un testo che è la risposta.

Ci serve una funzione che controlli la risposta. La scriviamo in questo modo:

function errata() {

alert ("Risposta errata!");

}

Questa è una funzione che mi dà sempre una risposta errata. Infatti con:

onclick="errata()"

ogni volta che si preme il pulsante viene eseguita la funzione errata().

2° pulsante

Intanto ci serve un pulsante di comando; lo possiamo costruire facilmente con la seguente istruzione:

Sul pulsante viene scritta la lettera B; quando l'utente clicca con il mouse, con la funzione esatta() che costruiremo dopo, controlleremo se la risposta è giusta.

Si tratta ora di scrivere la funzione esatta().

Intanto completiamo quello che deve essere scritto dopo il pulsante nel seguente modo:

<input type="button" value=" B " onclick="esatta()" > la proprietà di essere ridotti in lamine sottili.<br>

che l'utente vedrà cosi:

la proprietà di essere ridotti in lamine sottili.

cioè il pulsante seguito da un testo che è la risposta.

Ci serve una funzione che controlli la risposta. La scriviamo in questo modo:

function esatta() {

alert ("Risposta esatta!");

}

Questa è una funzione che mi dà sempre una risposta esatta. Infatti con:

onclick="esatta()"

ogni volta che si preme il pulsante viene eseguita la funzione esatta().

3° pulsante

Procediamo nello stesso modo dei pulsanti precedenti.

Intanto ci serve un pulsante di comando; lo possiamo costruire facilmente con la seguente istruzione:

Sul pulsante viene scritta la lettera C; quando l'utente clicca con il mouse, con la funzione errata() che abbiamo già costruito sopra, controlleremo se la risposta è giusta.

Intanto completiamo quello che deve essere scritto dopo il pulsante nel seguente modo:

<input type="button" value=" C " onclick="errata()" > la proprietà di essere facilmente ridotti in fili sottili.<br>

che l'utente vedrà cosi:

la proprietà di essere facilmente ridotti in fili sottili.

cioè il pulsante seguito da un testo che è la risposta.

Il listato completo del programma è:

function esatta() {

alert ("Risposta esatta!");

}

function errata() {

alert ("Risposta errata!");

}

</script>

Questo è un programma di tecnologia.<br>

Faccia click col sinistro del mouse sulla risposta esatta. <br><br>

La malleabilità di un materiale è:<br>

<input type="button" value=" A " onclick="errata()" > la proprietà di cedere facilente alle idee altrui.<br>

<input type="button" value=" B " onclick="esatta()" > la proprietà di essere ridotti in lamine sottili.<br>

<input type="button" value=" C " onclick="errata()" > la proprietà di essere facilmente ridotti in fili sottili.<br>

listato di secondo.html

Scriviamolo con Word e salviamolo con il nome dip secondo.html e proviamolo con Internet Explorer per vedere se funziona. Dovremmo vedere:

Esercizio da svolgere n. 1

Scrivere un programma di tecnologia che mi dica la risposta esatta alla seguente domanda:

Se comprimiamo con la forza di migliaia di kg un pilastro di cemento armato:
il pilastro si schiaccia, essendo i fili di ferro molto sottili.
il pilastro resiste compressione a causa del cemento e ghiaia in esso presenti.
il pilastro resiste se siamo in assenza di forti venti.

Esercizio da svolgere n. 2

Scrivere un programma di tecnologia che mi dica la risposta esatta alla seguente domanda:

La durezza è:
la proprietà di un materiale di opporsi alla penetrazione da parte di un altro oggetto.
la proprietà di mantenere nel tempo le proprie convinzioni tecnologiche.
la proprietà di ritornare nella forma originale dopo essere stati allungati o schiacciati.