img

"Una Calcolatrice"

La Potenza nel Calcolo Matematico della "funzione eval()"


Codice Sorgente della Calcolatrice:
<div class="contenutoCalc">
 <form name="calc">    
  <ul class="calcolatrice">
   <span><input type="text" name="input" value=""></span>
   <li><input type="button" name="uno"      value="  1  " onclick="calc.input.value += '1'"></li>
   <li><input type="button" name="due"      value="  2  " onclick="calc.input.value += '2'"></li>
   <li><input type="button" name="tre"      value="  3  " onclick="calc.input.value += '3'"></li>
   <li class="nero"><input type="button" name="piu"      value="  +  " onclick="calc.input.value += ' + '"></li>
   <li><input type="button" name="quattro"  value="  4  " onclick="calc.input.value += '4'"></li>
   <li><input type="button" name="cinque"   value="  5  " onclick="calc.input.value += '5'"></li>
   <li><input type="button" name="sei"      value="  6  " onclick="calc.input.value += '6'"></li>
   <li class="nero"><input type="button" name="meno"     value="  -  " onclick="calc.input.value += ' - '"></li>
   <li><input type="button" name="sette"    value="  7  " onclick="calc.input.value += '7'"></li>
   <li><input type="button" name="otto"     value="  8  " onclick="calc.input.value += '8'"></li>
   <li><input type="button" name="nove"     value="  9  " onclick="calc.input.value += '9'"></li>
   <li class="nero"><input type="button" name="per"      value="  x  " onclick="calc.input.value += ' * '"></li>
   <li><input type="button" name="canc"     value="  C  " onclick="calc.input.value = ''"></li>
   <li><input type="button" name="zero"     value="  0  " onclick="calc.input.value += '0'"></li>
   <li><input type="button" name="uguale"   value="  =  " onclick="calc.input.value = eval(calc.input.value)"></li>
   <li class="nero"><input type="button" name="diviso"   value="  /  " onclick="calc.input.value += ' / '"></li>
  </ul>
 </form>
</div
Codice Css della Calcolatrice:
.contenutoCalc {
 width: 340px;
 background: #f4f3ef;
 border-style: solid;
 border-width: 1px;
 border-color: #e3e2de;
 border-radius: 15px;
}
.calcolatrice li {
 width: 50px;
 display: inline-block;
 text-decoration: none;
 background: #f4f3ef;
 padding: 0px 3px;
 margin: 3px 0px 3px 3px;
 border-style: solid;
 border-width: 1px;
 border-color: #e3e2de;
 border-radius: 6px;
}
.calcolatrice li:hover {
 background: #f0efeb;
}
.calcolatrice input {
 width: 48px;
 font-family: Consolas, Arial, sans-serif;
 font-weight: 500;
 text-align: center;
 font-size: 1.1em;
 color: #000;
 line-height: 100%;  
 text-decoration: none;
 background: #fff;
 padding: 8px 0px;
 margin: 3px 0px;
 border-style: solid;
 border-width: 1px;
 border-color: #e3e2de;
 border-radius: 6px;
}
input[type="text"] {
 width: 250px;
 font-family: Consolas, Arial, sans-serif;
 font-weight: 400;
 text-align: left;
 font-size: 1.2em;
 color: #000;
 line-height: 120%;  
 background: #fff;
 padding-left: 10px;
 margin: 0px 0px 6px 0px;
 border-style: solid;
 border-width: 1px;
 border-color: #e3e2de;
 border-radius: 12px;
}
.nero input {
 background: #000;
 color: #fff;
}
.uguale input {
 background: #f1c100;
}
li.nero {
 background: #fff;
}