Edit in JSFiddle

//Attente de l'enclenchement d'un clic de sousris sur le bouton commander, on exécute ensuite la fonction generCde
document.getElementById("cde").addEventListener("click",generCde);

function generCde(){
//Récupération des valeurs du formulaire

	
	var NbrePizza = document.getElementById("nbrpizza").value;//récupère le 
	var Choix = document.getElementById("choix").value;
	var ChoixVille = document.getElementById("choixville").value;
	var Choixanni = document.getElementById("choixanni").value;
	var Fond = document.getElementById("fond").value;
	var Background = Aff(Fond); 
	var ChoixVille = document.getElementById("choixville").value;
	var Npizza = "";
	var picture = "";

	//Fonction CalculPrix (en fonction du nombre de pizzas et du type de pizzas)
	var cout = CalculPrix(NbrePizza, Choix);
	//Fonction Liv(Para rapport aux prix, anniversaire et disance, on calcule si il y a un supplément ou une réduction)
	var Livraison = Liv(cout, Choixanni, ChoixVille);
	

	//Choix de la phrase en fonction de la sélection 
	if (Choix === "fromage") 
	{
		Npizza = "Pizza(s) au fromage";
		picture = '<img src="Informatique/programmation/JavaScript/img/fromage.jpg" alt="pizza fromage"/>';
		
	}
	else if (Choix === "lardon")
	{
		Npizza = "Pizza MEGA composé de (lardons et patates)";
		picture = '<img src="Informatique/programmation/JavaScript/img/mega.jpg" alt="pizza mega"/>';
	}
	else
	{
		Npizza = "Pizza(s) royal composé de pleins d'ingrédients";
		picture = '<img src="Informatique/programmation/JavaScript/img/royal.jpg" alt="pizza royal"/>';

	}
	// ##################################
	// Mise en forme du bon de commande #
	// ##################################
	var Result = "<h1>Votre commande:</h1><br><hr>";
	Result += "<p>Attention</p>";
	Result += "<p> - Supplément de 2 euros pour la pizza royale.</p>";
	Result += "<p> - Si livraison est hors de la ville," + "<em>" + "supplément de 3 euros" + "</em>" + "</p>"; 
	Result += "<p>Vous avez commandé: " + "<b>" + NbrePizza + " " + "</b>" + Npizza + "</p>";
	
	if (Livraison === 0) 
	{
	Result += "<p>Vous devrez payez la somme de :" + cout + "<b>" + " euros " + "</b>" + "</p>";	
	}
	else
	{
			cout += Livraison;
			Result += "<p>Vous devrez payez au total la somme de :" + cout + "<b>" + " euros " + "</b>" + " (incluant frais de livraison de " + Livraison + " euros)" + "</p>";	

	}
	
	document.getElementById("affiche").innerHTML = Result;
	document.getElementById("picture").innerHTML = picture;
	// ##################################
}

//Fonction CalculPrix(Récupération des arguments NbrePizza et Choix)
function CalculPrix(NbrePizza, Choix){
		
		var piz = 10;
		var cout;

		if (Choix === "royal" ){
			cout = Number(piz * NbrePizza) + 2;
		}
		else
		{
			cout = Number(piz * NbrePizza);
		}
		return cout;
		
}

//Fonction Liv(Récupération des arguments Cout, Choixanni, ChoixVille)
function Liv(cout, Choixanni, ChoixVille){
	var Livraison = 0;
	/*document.write(Choixanni);*/
	if (((ChoixVille === "ville") && (cout > 15)) || (Choixanni === "oui"))
	{
		Livraison = 0;
	}

	else
	{
		Livraison = 3;
	}

	return Livraison;
}

// //Fonction Aff(Récupération de l'argument fond)
function Aff(fond){
	if (fond === "ciel"){
		document.body.style.backgroundImage = "url('Informatique/programmation/JavaScript/img/Blue_Sky.jpg')";
		

	}
	else if (fond === "sand") {

		document.body.style.backgroundImage = "url('Informatique/programmation/JavaScript/img/sand.jpg')";

	}
	else
	{
			document.body.style.background = "transparent";

	}
}

<p class="ex">Exercice 4:</p>
                <h3>Gestion d'une liste avec un affichage en fonction des sélections de l'internaute</h3>
                
            <div id="content_ex3">
                   <form>

                      <label>Combien de pizzas voulez-vous</label>
                        <input type="number" id="nbrpizza" value="1"/><br>
                        <label>Quel genre de pizzas voulez-vous ?</label>
                          <select id="choix">
                            <option value="fromage">Au fromage</option>
                            <option value="lardon">Mega</option>
                            <option value="royal">Royal</option>
                          </select>
                <br/><br/>

                      <label>Livraison dans quelle ville ?</label>
                          <select id="choixville">
                            <option value="ville">En ville</option>
                            <option value="Ollioules">A Lyon</option>
                            <option value="Hyères">A Paris</option>
                         </select>
                  <br><br>
                  
                      <label>Est-ce votre anniversaire ?</label>
                          <select id="choixanni">
                            <option value="oui">Oui</option>
                            <option selected="non" value="non">Non</option>
                         </select><br><br>

                         <label>Background</label>
                          <select id="fond">
                            <option value="ciel">Ciel</option>
                            <option value="sand">Sand</option>
                            <option value="not">No Color</option>
                         </select>


                   </form>
                <button type="button" id="cde">Commander</button> 
            </div>

/* Gestion du CSS TP4 */

#content_ex3{
width:90%;
margin:0 auto;
border-radius:10px;
border:1px solid #000;
padding:10px;
background-color:#ddd;
}