Outils pour utilisateurs

Outils du site


cours2007:poo1:tp:monnayeur

Monnayeur (le retour)

Pour commencer

Faire simple !

Sur le modèle de salutation, faire un formulaire avec 2 champs de saisie : prix et versé.
Un clic sur le bouton doit afficher la différence des deux champs.

Si besoin de savoir comment rendre la monnaie

code aux tendances du web :
Code d'exemple juste utiliser comme modèle pour le calcul des pièces.

Travail

Refaire le code HTML/CSS/JavaScript selon les exemples précédant

Champs de saisies :

<tr>
  <td align="right">Prix : </td>
  <td><input type="text" name="Prix_Article"><br> </td>
</tr>

Devient

<p>
    <label for="prix">Prix</label>
    <input type="text" name="prix" value="" id="prix" />
</p>

Afficher les résultats :

<tr>
  <td align="right">10 : </td>
  <td><input type="text" name="Nb10"></td>
</tr>

Devient

<ul>
    <li>Nombre de piéce de 20 : <span id="p20">0</span></li>
    ...
</ul>

Lire les données du formulaire

parseInt(document.formulaire.Prix_Article.value);

Devient

parseInt($('prix').value,10);

Afficher les résultats :

document.formulaire.Nb10.value = P10;

Devient

$('p10').setText(p10);

Remplacer l'utilisation d'alert par un message avec un style

#erreur {
    color:red;
}
<p id="erreur" />

Regrouper le calcul de la division entière en une fonction

Ecrire le code d'une fonction réalisant la division entière.

function div (numerateur,diviseur) {
  // code
  return quotient;
}

Utiliser ce code :

var p10 = div(reste,10);

Éviter la répétition du code de calcul pour chaque pièce

Utiliser une boucle :

[20,10,5,2,1].each(function(x) {
  // code pour une piéce
});

Faire de même pour l'affichage

Sur le modèle de :

$('pieces').appendChild(new Element('li').setText('encore !')
cours2007/poo1/tp/monnayeur.txt · Dernière modification: 2008/04/24 22:00 (modification externe)