Please Wait
Cosa Cerchi?  

Lezione 08 - Javascript: istruzioni condizionali

 

L'istruzione condizionale IF

Come ogni linguaggio di programmazione che si rispetti, anche Javascript è dotato di istruzioni condizionali, cioé istruzioni che consentono di verificare la presenza di determinate condizioni.
Ad esempio, se volessi sapere se l'utente che sta utilizzando il mio sito ha inserito il suo nome utente all'interno dell'apposito campo, potrei verificare che il contenuto del campo sia diverso da una stringa vuota o che la lunghezza del suo contenuto sia maggiore di zero.
Vediamolo con un esempio concreto:

<html>
<head>
<title>Prova Javascript</title>
<script language="Javascript">
	function Controlla()
	{
		if (document.MioForm.Nome.value == '')
		{
		    alert('Inserisci il tuo nome');
		}
	}
</script>

</head>

<body>
<form name="MioForm">
  Nome Utente:
  <input type="text" id="Nome" size="20" /><br />
  <input type="button" name="btnElabora" value="Elabora" onClick="Controlla()" />
</form>
</body>
</html>

L'istruzione "if" effettua un controllo e consente di stabilire quali operazioni effettuare al verificarsi della condizione e quali al NON verificarsi di quest'ultima.
Esiste infatti la possibilità di dire cosa fare nel caso in cui la condizione non si verifichi mediante l'opzione "else".
Modifichiamo l'esempio precedente aggiungendo le istruzioni evidenziate in grassetto:

<html>
<head>
<title>Prova Javascript</title>
<script language="Javascript">
	function Controlla()
	{
		if (document.MioForm.Nome.value == '')
		{
		    alert('Inserisci il tuo nome');
		} else {
		    alert('Ciao!!');
		}
	}
</script>
</head>

<body>
<form name="MioForm">
  Nome Utente:
  <input type="text" id="Nome" size="20" /><br />
  <input type="button" name="btnElabora" value="Elabora" onClick="Controlla()" />
</form>
</body>
</html>

Come si può notare le parentesi graffe delimitano le istruzioni da eseguire nel caso si verifichi (dopo la condizione) o non si verifichi (dopo else) la condizione specificata.
Possiamo anche verificare più condizioni contemporaneamente:

<html>
<head>
<title>Prova Javascript</title>
<script language="Javascript">
	function Controlla()
	{
		if ((document.MioForm.Nome.value.lenght == 0)
			&& (document.MioForm.Cognome.value.lenght == 0))
		{
		    alert('Inserisci i dati richiesti');
		}
	}
</script>
</head>

<body>
<form name="MioForm">
  Nome:
  <input type="text" id="Nome" size="20" /><br />
  Cognome:
  <input type="text" id="Cognome" size="20" /><br />
  <input type="button" name="btnElabora" value="Elabora" onClick="Controlla()" />
</form>
</body>
</html>

L'istruzione condizionale SWITCH

Pu? accadere che si debba verificare il valore di una variabile e in base al valore contenuto far eseguire al browser istruzioni diverse.
/ Ad esempio supponiamo di voler visualizzare un messaggio diverso a seconda del giorno della settimana in cui ci troviamo.
Una cosa del tipo: "Oggi è Lunedì", oppure "Oggi è Martedì", Oggi è Mercoledì", e così via...
Per farlo dovrei fare una serie di IF uno dentro l'altro per verificare il giorno e visualizzare il messaggio:

<html>
<head>
<title>Prova Javascript</title>
<script language="Javascript">
	function Oggi()
	{
		var data = new Date();
		var giorno = data.getDay();
		if (giorno == 0)
		{
		  document.write('Oggi è Domenica');
		} else {
		  if (giorno == 1)
		  {
			document.write('Oggi è Lunedì');
		  } else {
			if (giorno == 2)
			{
			  document.write('Oggi è Martedì');
			} else {
			  if (giorno == 4)
			  {
				document.write('Oggi è Mercoledì');
			  } else {
				if (giorno == 5)
				{
				  document.write('Oggi è Giovedì');
				} else {
				  if (giorno == 6)
				  {
					document.write('Oggi è Venerdì');
				  } else {
					document.write('Oggi è Sabato');
				  }
				}
			  }
			}
		  }
		}
	}
</script>
</head>

<body>

<script language="Javascript">
Oggi();
</script>

<b>Notizie del giorno:</b>
<p>Il Presidente della Repubblica si &egrave; recato in visita ......</p>
</body>
</html>

Con l'istruzione SWITCH tutto diventa più semplice:

<html>
<head>
<title>Prova Javascript</title>
<script language="Javascript">
	function Oggi()
	{
		var data = new Date();
		var giorno = data.getDay();
		switch (giorno)
		{
		case 0:
		  document.write('Oggi è Domenica');
		  break;
		case 1:
		  document.write('Oggi è Lunedì');
		  break;
		case 2:
		  document.write('Oggi è Martedì');
		  break;
		case 3:
		  document.write('Oggi è Mercoledì');
		  break;
		case 4:
		  document.write('Oggi è Giovedì');
		  break;
		case 5:
		  document.write('Oggi è Venerdì');
		  break;
		default:
		  document.write('Oggi è Sabato');
		  break;
		}
	}
</script>
</head>

<body>

<script language="Javascript">
Oggi();
</script>

<b>Notizie del giorno:</b>
<p>Il Presidente della Repubblica si &egrave; recato in visita ......</p>
</body>
</html>

Prossimamente

Nella prossima lezione vedremo l'utilizzo delle istruzioni iterative.

Freelance Jobs

Credits

x

Layout e Contenuti © Stefano Pozzati (POZZware.com)
Realizzazione Tecnica e Grafica © Stefano Pozzati (POZZware.com)
Hosting - Aruba (www.aruba.it)
Immagini del titolo © Shunya Yamashita (http://shunyama.web.fc2.com/)
 

Realizzato con:  WebSitter By Pozzware.com Browser compatibili:  Explorer Internet Explorer 6
Firefox Mozilla FireFox 2
Chrome Google Chrome
 
Strumenti:  FCK Editor
JQuery
Valid XHTML 1.0 Transitional CSS Valido!