重置计算器输入框为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

回答

相关问题