Membre de ClickFR, Reseau francophone Paie-Par-Click
Accueil
Accueil
- [ CSS : ] [ DHTML : ] [ HTML : ] [ JavaScript : ] [ Refs : ]
Accueil

JavaScript 1.3

  Calculatrice

fonction de ce script  principe de ce script  le script lui-meme  demonstration du script  telechargement du script

  Fonction
Le but de ce script est créer une petite calculatrice avec des fonctions simples, addition, soustraction, multiplication et division, plus une fonction de mémorisation, rappel de mémoire et pouvoir rendre un nombre négatif.
  Principe
Le JavaScript sait très bien calculer.
Il suffit donc de quelques fonctions simples pour arriver à nos fins :
  1. Une pour alimenter la zone d'affichage de la calculatrice,
  2. une pour effectuer le calcul de se qui se trouve dans l'affichage,
  3. une pour tester la validité de la chaine soumise au calcul,
  4. deux pour la mémoire (mémoriser et rappeler la mémoire),
  5. une dernière pour rendre les nombres négatifs.
  Le script
dans la partie <head>
<script language="JavaScript">
// permet d'alimenter la zone d'affichage sans effacer le début de la saisie
function alim(valeur) {
document.calculatrice.affichage.value = document.calculatrice.affichage.value + valeur;
}

// permet de refuser le calcul s'il commence par *, / ou + (génèrerait une erreur JavaScript)
function test() {
var chaine = document.calculatrice.affichage.value.substring(0,1);
validation = /\/|\*|\+/;
if (validation.exec(chaine)) {

// message si un mauvais caractère est trouvé au début de la zone d'affichage
alert('Votre operation est invalide, elle commence par, le signe \' ' + chaine + ' \' !!');
document.calculatrice.affichage.focus();
return false;
}
else {
return true;
}
}

// la fonction de calcul proprement dite
function calcul(){
if (test()) {
resultat = eval(document.calculatrice.affichage.value);

// Affichage du résultat dans la zone d'affichage
document.calculatrice.affichage.value = resultat;
return true;
}
}

// place ce qui est affiché dans une zone cachée du formulaire
function memoriser() {
document.calculatrice.memoire.value = document.calculatrice.affichage.value;
}

// appelle ce qui a été caché
function rappelmem() {
document.calculatrice.affichage.value = document.calculatrice.affichage.value + document.calculatrice.memoire.value;
}

// ajoute le signe - (moins) au début de l'affichage (rend le nombre négatif)
function negatif() {
document.calculatrice.affichage.value = '-' + document.calculatrice.affichage.value;
}
</script>

dans la partie <body>
<form name="calculatrice">
<input type="text" name="affichage" value="" size="12"><br>
<input type="hidden" name="memoire">

<table border="0" cellspacing="0" cellpadding="3">
<tr align="center">
<td><input type="button" name="sept" value=" 7 " OnClick="alim(7);"></td>
<td><input type="button" name="huit" value=" 8 " OnClick="alim(8);"></td>
<td><input type="button" name="neuf" value=" 9 " OnClick="alim(9);"></td>
<td><input type="button" name="division" value=" / " OnClick="alim('/');"></td>
<td><input type="button" name="ce" value="CE" OnClick="reset(document.calculatrice.affichage);"></td>
</tr>
<tr align="center">
<td><input type="button" name="quatre" value=" 4 " OnClick="alim(4);"></td>
<td><input type="button" name="cinq" value=" 5 " OnClick="alim(5);"></td>
<td><input type="button" name="six" value=" 6 " OnClick="alim(6);"></td>
<td><input type="button" name="multiplication" value=" * " OnClick="alim('*');"></td>
<td><input type="button" name="mem" value="MEM" OnClick="memoriser();"></td>
</tr>
<tr align="center">
<td><input type="button" name="un" value=" 1 " OnClick="alim(1);"></td>
<td><input type="button" name="deux" value=" 2 " OnClick="alim(2);"></td>
<td><input type="button" name="trois" value=" 3 " OnClick="alim(3);"></td>
<td><input type="button" name="soustraction" value=" - " OnClick="alim('-');"></td>
<td><input type="button" name="rcl" value="RCL" OnClick="rappelmem();"></td>
</tr>
<tr align="center">
<td><input type="button" name="zero" value=" 0 " OnClick="alim(0);"></td>
<td><input type="button" name="point" value=" . " OnClick="alim('.');"></td>
<td><input type="button" name="egal" value=" = " OnClick="calcul();"></td>
<td><input type="button" name="addition" value=" + " OnClick="alim('+');"></td>
<td><input type="button" name="neg" value=" neg " OnClick="negatif();"></td>
</tr>
</table>
  Démonstration



  Téléchargement
Ce script est disponible en deux versions :
  • le script est intégré à la page où il agit,
  • le script est dans un fichier séparé de la page où il agit (fichier.js et fichier.html).

    L'intérêt d'un script dans un fichier séparé est de pouvoir le partager entre plusieurs pages html.
    Cela permet aussi de le rendre inaccessible à toute personne qui souhaiterai l'enregistrer pour une autre utilisation.
  • Script intégré :
    calculs_calculette.zip
    2 Ko
    telechargez le script telechargez le script
    Script séparé :
    calculs_calculette2.zip
    2 Ko
    Recherche
    aide sur la recherche
    hit-parade
    Votez TOP Ouaibe !

    statistiques
    aide sur les contacts aide sur la mailing-list aide sur la newsletter