重置計算器輸入框爲js

下一個操作其html5和js計算器。任何操作後，如果我按任何按鈕號碼它將被添加到答案的結尾，如果操作是（2 + 2）答案將是（4）如果我按（5）按鈕做另一個操作，它會被添加到4（45）的末尾如何重置輸入框如果一個操作已經完成，另一個啓動？重置計算器輸入框爲js

這是我的代碼

<title>Untitled Document</title> 

<style type="text/css"> 

.border-style{ 
    border: hidden; 
} 

.input-style{ 
    width:100%; 
    height:38px; 
} 

    </style> 
    </head> 

    <body> 

<form name="calc"> 

    <table border=3 align="center" width="40%" style="border:solid" > 

    <tr> 
     <td colspan="5" height="40px" width="71%" class="border-style"> 
      <input id="input" type="text" name="Num" value="0"  style="width:98%; height:20px" /> 
     </td> 
     <td align="center" width="14.2%" class="border-style"> 
      <input type="button" value="C" onclick="deleteDigit(this.form.Num)" class="input-style" /> 
     </td> 
     <td align="center" width="14.2%" class="border-style"> 
      <input type="button" value="CE" onclick="document.calc.Num.value = ' ' " class="input-style" /> 
     </td> 
    </tr> 

    <tr> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="x^y" onclick="power(this.form)"  class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="Sin" onclick="sin(this.form)"class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="7" onclick="document.calc.Num.value += '7'" class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="8" onclick="document.calc.Num.value += '8'" class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="9" onclick="document.calc.Num.value += '9'" class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="+/-"onclick="flipSign(this.form.Num)" class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="mod"onclick="document.calc.Num.value +='%'" class="input-style"/> 
     </td> 
    </tr> 

    <tr> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="root" onclick="sqrt(this.form)" class="input-style"/> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="cos" onclick="cos(this.form)" class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="4" onclick="document.calc.Num.value +='4'" class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="5"onclick="document.calc.Num.value +='5'" class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="6"onclick="document.calc.Num.value +='6'" class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="+"onclick="document.calc.Num.value +='+'" class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="-"onclick="document.calc.Num.value +='-'" class="input-style" /> 
     </td> 
    </tr> 

    <tr> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="n!"onclick="factorial(this.form)" class="input-style"/> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="tan"onclick="tan(this.form)" class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="1"onclick="document.calc.Num.value +='1'" class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="2"onclick="document.calc.Num.value +='2'" class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="3"onclick="document.calc.Num.value +='3'" class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="*"onclick="document.calc.Num.value +='*'" class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="/"onclick="document.calc.Num.value +='/'" class="input-style" /> 
     </td> 
    </tr> 
    <tr> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="fib"onclick="fib(this.form)" class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="log"onclick="lg(this.form)" class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="0"onclick="document.calc.Num.value +='0'" class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="." onclick="document.calc.Num.value +='.'" class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="10^x" onclick="powerten(this.form)" class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="Ans" onclick="SaveANS()" class="input-style" /> 
     </td> 
     <td height="40px" width="14.2%" class="border-style"> 
      <input type="button" value="=" onclick="equal(this.form)" class="input-style" /> 
     </td> 
    </tr> 

    </table> 

    <script type="text/javascript" > 

// saving Ans 
var Ans=0; 


// Delete last digit entered 
function deleteDigit(Num) { 
    Num.value = Num.value.substring(0, Num.value.length - 1) 
} 


// Power Function 
function power(n){ 
    if (n.Num.value != "" && n.Num.value != 0){ 
     var p=prompt("Enter the power:") 
     n.Num.value = Math.pow(n.Num.value,p) 
     Ans=n.Num.value; 
    } 
    else 
     alert("Enter a number first") 
} 


// sin Function 
function sin(n) { 
    n.Num.value = Math.sin(n.Num.value); 
    Ans=n.Num.value; 
} 


// Flips the sign of the value 
function flipSign(Num) { 
    if(Num.value.substring(0, 1) == "-") 
     Num.value = Num.value.substring(1, Num.value.length) 
    else 
     Num.value = "-" + Num.value 
} 


// Square root Function 
function sqrt(n) { 
    if (n.Num.value != "" && n.Num.value != 0){ 
     var p=prompt("Enter the root:") 
     p=1/p; 
     n.Num.value = Math.pow(n.Num.value,p) 
     Ans=n.Num.value; 
    } 
    else 
     alert(" please input the nuber first !!!") 
} 



// cos Function 
function cos(n) { 
    n.Num.value = Math.cos(n.Num.value); 
    Ans=n.Num.value; 
} 


// Factorial Function 
function factorial(n){ 
    var var1, var2; 
    var1=1; 
    var2=1; 
    var x=n.Num.value; 

    do { 
     var1=var1*var2; 
     var2=1+var2; 
    }while(var2<=x); 

    n.Num.value =var1; 
    Ans=var1; 
} 


// tan Function 
function tan(n) { 
    n.Num.value = Math.tan(n.Num.value); 
    Ans=n.Num.value; 
} 


// Fibonacci Function 
function fib(n){ 
    var var1=0; 
    var var2=1; 
    var result; 
    var x= n.Num.value; 
    for (var i=1 ; i<x ; i++){ 
     result=var1+var2; 
     var1=var2; 
     var2=result; 
    } 
    n.Num.value =result; 
    Ans=result; 
} 


// Log Function 
function lg(form) { 
    n.Num.value = Math.log(n.Num.value); 
    Ans=n.Num.value; 
} 


// 10^powr Function 
function powerten(n) { 
    var x=n.Num.value; 
    n.Num.value = Math.pow(10,x) 
    Ans=n.Num.value; 
} 


function equal(n){ 
    var var1=eval(document.getElementById("input").value); 
    result = eval(var1) ; 
    document.getElementById("input").value = result ; 
    Ans=result; 

} 


function SaveANS(){ 
    document.getElementById("input").value =Ans; 
} 

    </script> 

    </form> 
    </body> 

    </html>

來源

2013-03-17 fatimah

他們必須按下才能得到答案，正確等號按鈕？

有一個標誌（一個布爾變量，也許在全局範圍內），當等號被按下時（或者如果你正在使用提交事件，表單被「提交」），它被設置爲true。然後，在任何後續的按鈕單擊時，如果該標誌爲true，則在執行正常例程之前清除輸入框 - 當然，注意將標誌設置爲false。

您可能還需要確保你的HTML是有效的（開始和結束html和body標籤，HTML5文檔類型等）

來源

2013-03-17 07:22:00 Xunnamius

的話，我應該使用的onclick數字，而不是一個函數（document.calc.Num .value + =）？ – fatimah 2013-03-17 15:53:06

這會是最簡單的，是的。 – Xunnamius 2013-03-17 16:20:27

我會盡快嘗試，如果它的工作我會標記你的aswer：D並且非常感謝 – fatimah 2013-03-18 07:50:05

重置計算器輸入框爲js

回答

相關問題