Implementierung einer einfachen Taschenrechnerfunktion basierend auf Javascript_Javascript-Kenntnissen-js-Tutorial-php.cn

Implementierung einer einfachen Taschenrechnerfunktion basierend auf Javascript_Javascript-Kenntnissen

WBOY

Freigeben： 2016-05-16 15:22:15

Original

1169 Leute haben es durchsucht

Das Beispiel in diesem Artikel stellt den detaillierten Code von Javascript zur Implementierung einer einfachen Taschenrechnerfunktion vor und teilt ihn als Referenz mit Ihnen. Der spezifische Inhalt ist wie folgt

Rendering:

Implementierungscode:

<html> 
  <head> 
    <script> 
      function calc(event){ 
        // test  
        //window.alert(event.value); 
        var val = new String(event.value); 
        // clear space 
        val = val.trim(); 
        var res = document.getElementById("res"); 
        // clear 
        if(val == "clear"){ 
          res.value = ""; 
        } 
 
        // back 
        if(val == "back"){ 
          res.value = res.value.substring(0, res.value.length - 1); 
        } 
 
        // power 
        if(val == "power"){ 
          val = "p"; 
        } 
        // add val to text 
        if(val.length == 1 && val != "="){ 
          res.value = res.value + val; 
        } 
  
        // calc result 
        if(val == "="){ 
          var arr; 
          var result; 
          // power 
          if(res.value.indexOf("p") != -1){ 
            arr = res.value.split("p"); 
            //window.alert(arr); 
             result = Math.pow(parseFloat(arr[0]) ,parseFloat(arr[1])); 
            //window.alert(res); 
            res.value = result; 
          }       
          // plus 
          if(res.value.indexOf("+") != -1){ 
            arr = res.value.split("+"); 
            //window.alert(arr); 
             result = parseFloat(arr[0]) + parseFloat(arr[1]); 
            //window.alert(res); 
            res.value = result; 
          } else if(res.value.indexOf("-") != -1){ 
            // minus 
            arr = res.value.split("-"); 
            //window.alert(arr); 
            result = parseFloat(arr[0]) - parseFloat(arr[1]); 
            //window.alert(res); 
            res.value = result; 
          } else if(res.value.indexOf("*") != -1){ 
            // multiply 
            arr = res.value.split("*"); 
            //window.alert(arr); 
            result = parseFloat(arr[0]) * parseFloat(arr[1]); 
            //window.alert(res); 
            res.value = result; 
          } else if(res.value.indexOf("/") != -1){ 
            // division 
            arr = res.value.split("/"); 
            //window.alert(arr); 
            result = parseFloat(arr[0]) / parseFloat(arr[1]); 
            //window.alert(res); 
            res.value = result; 
          } else if(res.value.indexOf("%") != -1){ 
            // module 
            arr = res.value.split("%"); 
            //window.alert(arr); 
            result = parseFloat(arr[0]) % parseFloat(arr[1]); 
            //window.alert(res); 
            res.value = result; 
          } 
        }   
      } 
    </script> 
  </head> 
  <body> 
    <table border="1px" cellpadding="10px" cellspacing="5px" align="center"> 
      <tr align="center"> 
        <td colspan="4"><input type="text" id="res" size="35px" value="" style="text-align:right;"/></td> 
      </tr> 
      <tr align="center"> 
        <td><input type="button" value="power" onclick="calc(this)"/></td> 
        <td><input type="button" value="clear" onclick="calc(this)"/></td> 
        <td colspan="2"><input type="button" value="   back   " onclick="calc(this)"/></td> 
      </tr> 
      <tr align="center"> 
        <td><input type="button" value="  1  " onclick="calc(this)"/></td> 
        <td><input type="button" value="  2  " onclick="calc(this)"/></td> 
        <td><input type="button" value="  3  " onclick="calc(this)"/></td> 
        <td><input type="button" value="  +  " onclick="calc(this)"/></td> 
      </tr> 
      <tr align="center"> 
        <td><input type="button" value="  4  " onclick="calc(this)"/></td> 
        <td><input type="button" value="  5  " onclick="calc(this)"/></td> 
        <td><input type="button" value="  6  " onclick="calc(this)"/></td> 
        <td><input type="button" value="  -  " onclick="calc(this)"/></td> 
      </tr> 
      <tr align="center"> 
        <td><input type="button" value="  7  " onclick="calc(this)"/></td> 
        <td><input type="button" value="  8  " onclick="calc(this)"/></td> 
        <td><input type="button" value="  9  " onclick="calc(this)"/></td> 
        <td><input type="button" value="  *  " onclick="calc(this)"/></td> 
      </tr> 
      <tr align="center"> 
        <td><input type="button" value="  0  " onclick="calc(this)"/></td> 
        <td><input type="button" value="  =  " onclick="calc(this)"/></td> 
        <td><input type="button" value="  %  " onclick="calc(this)"/></td> 
        <td><input type="button" value="  /  " onclick="calc(this)"/></td> 
      </tr> 
    </table> 
  </body> 
</html>

Nach dem Login kopieren

Ich hoffe, dass dieser Artikel für alle hilfreich ist, die JavaScript-Programmierung lernen.