Question

我正在用javaScript创建一个计算器应用程序，在该应用程序中所有算术运算都将起作用（简单算术计算器）。但是数字0存在一个问题。如果我执行任何将数字0保持在数字前面的操作，则会显示错误的输出。同样，如果我执行任何在数字后保持0的操作，则给出正确的答案。到目前为止，我已经完成了。请检查。

<script>
 function displayNum(n1){
calculator.text1.value = calculator.text1.value + n1;
 }
</script>

<form name="calculator" >
<input type="text" name="text1" style="text-align:right"><br>
<input type="button" name="num2" value=2 onclick="displayNum(num2.value)">
<input type="button" name="num3" value=3 onclick="displayNum(num3.value)">
<input type="button" name="addnum" value=+ onclick="displayNum(addnum.value)"><br>
<input type="button" name="num4" value=4 onclick="displayNum(num4.value)">
<input type="button" name="num5" value=5 onclick="displayNum(num5.value)">
<input type="button" name="num6" value=6 onclick="displayNum(num6.value)">
<input type="button" name="subnum" value=- onclick="displayNum(subnum.value)"><br>
<input type="button" name="num7" value=7 onclick="displayNum(num7.value)">
<input type="button" name="num8" value=8 onclick="displayNum(num8.value)">
<input type="button" name="num9" value=9 onclick="displayNum(num9.value)">
<input type="button" name="mulnum" value=* onclick="displayNum(mulnum.value)"><br>
<input type="reset" name="reset" value=C>
<input type="button" name="num0" value=0 onclick="displayNum(num0.value)">
<input type="button" name="divnum" value=/ onclick="displayNum(divnum.value)">
<input type="button" name="equal" value== onclick="text1.value=eval(text1.value)">
 </form>

如果我提供012 + 3作为输入，那么输出将是13而不是15，这是不正确的。实际结果是012 + 3 = 13 预期结果应为012 + 3 = 15

Answer 1

要解决前导零的问题，建议将方程式存储在隐藏的输入中，并验证是否允许使用0。

let blockLeadingZero = true;
function displayNum(n1){
    calculator.text1.value = calculator.text1.value + n1;
    if(blockLeadingZero && n1 == 0){
        blockLeadingZero = false;
    } else {
        calculator.text2.value = calculator.text2.value + n1;
        if(n1 === "+" || n1 === "-" || 
            n1 === "*" ||n1 === "/"){
            blockLeadingZero = true;
        }
    }
}

由于我们将使用第二个隐藏的文本字段进行计算，因此您还需要稍微更改HTML部分。现在，“删除”按钮将清除text2字段值，而“ =”按钮将更改两个文本字段的值。

<form name="calculator" >
<input type="text" name="text1" style="text-align:right"><br>
<input type="hidden" name="text2" style="text-align:right"><br>
<input type="button" name="num2" value=2 onclick="displayNum(num2.value)">
<input type="button" name="num3" value=3 onclick="displayNum(num3.value)">
<input type="button" name="addnum" value=+ onclick="displayNum(addnum.value)"><br>
<input type="button" name="num4" value=4 onclick="displayNum(num4.value)">
<input type="button" name="num5" value=5 onclick="displayNum(num5.value)">
<input type="button" name="num6" value=6 onclick="displayNum(num6.value)">
<input type="button" name="subnum" value=- onclick="displayNum(subnum.value)"><br>
<input type="button" name="num7" value=7 onclick="displayNum(num7.value)">
<input type="button" name="num8" value=8 onclick="displayNum(num8.value)">
<input type="button" name="num9" value=9 onclick="displayNum(num9.value)">
<input type="button" name="mulnum" value=* onclick="displayNum(mulnum.value)"><br>
<input type="reset" name="reset" value=C onclick="calculator.text2.value=''">
<input type="button" name="num0" value=0 onclick="displayNum(num0.value)">
<input type="button" name="divnum" value=/ onclick="displayNum(divnum.value)">
<input type="button" name="equal" value== onclick="text2.value=eval(text2.value);text1.value=text2.value">
</form>

Answer 2

发现您的问题=>您没有更改eval参数。用我的按钮更改onclick的相等按钮

onclick="text1.value=eval((text1.value).replace(/\b0(\d+)\b/g, '$1'))"

function displayNum(n1){
  calculator.text1.value = calculator.text1.value + n1;
}

<form name="calculator" >
        <input type="text" name="text1" style="text-align:right"><br>
        <input type="button" name="num1" value=1 onclick="displayNum(num1.value)">
        <input type="button" name="num2" value=2 onclick="displayNum(num2.value)">
        <input type="button" name="num3" value=3 onclick="displayNum(num3.value)">
        <input type="button" name="addnum" value=+ onclick="displayNum(addnum.value)"><br>
        <input type="button" name="num4" value=4 onclick="displayNum(num4.value)">
        <input type="button" name="num5" value=5 onclick="displayNum(num5.value)">
        <input type="button" name="num6" value=6 onclick="displayNum(num6.value)">
        <input type="button" name="subnum" value=- onclick="displayNum(subnum.value)"><br>
        <input type="button" name="num7" value=7 onclick="displayNum(num7.value)">
        <input type="button" name="num8" value=8 onclick="displayNum(num8.value)">
        <input type="button" name="num9" value=9 onclick="displayNum(num9.value)">
        <input type="button" name="mulnum" value=* onclick="displayNum(mulnum.value)"><br>
        <input type="reset" name="reset" value=C>
        <input type="button" name="num0" value=0 onclick="displayNum(num0.value)">
        <input type="button" name="divnum" value=/ onclick="displayNum(divnum.value)">
        <input type="button" name="equal" value== onclick="text1.value=eval((text1.value).replace(/\b0(\d+)\b/g, '$1'))">
    </form>

Answer 3

这是您的问题的解决方案。我已经测试了例如0022 + 3、0033 * 002、6 / 003的示例一切都很好。评估之前，需要删除text1.value中的前导零。您可以使用以下代码

<script>
 function displayNum(n1){
calculator.text1.value = calculator.text1.value + n1;
 }
</script>

<form name="calculator" >
<input type="text" name="text1" style="text-align:right"><br>
<input type="button" name="num2" value=2 onclick="displayNum(num2.value)">
<input type="button" name="num3" value=3 onclick="displayNum(num3.value)">
<input type="button" name="addnum" value=+ onclick="displayNum(addnum.value)"><br>
<input type="button" name="num4" value=4 onclick="displayNum(num4.value)">
<input type="button" name="num5" value=5 onclick="displayNum(num5.value)">
<input type="button" name="num6" value=6 onclick="displayNum(num6.value)">
<input type="button" name="subnum" value=- onclick="displayNum(subnum.value)"><br>
<input type="button" name="num7" value=7 onclick="displayNum(num7.value)">
<input type="button" name="num8" value=8 onclick="displayNum(num8.value)">
<input type="button" name="num9" value=9 onclick="displayNum(num9.value)">
<input type="button" name="mulnum" value=* onclick="displayNum(mulnum.value)"><br>
<input type="reset" name="reset" value=C>
<input type="button" name="num0" value=0 onclick="displayNum(num0.value)">
<input type="button" name="divnum" value=/ onclick="displayNum(divnum.value)">
<input type="button" name="equal" value== onclick="text1.value=eval((text1.value).replace(/\b(0(?!\b))+/g, ''))">
 </form>

如何通过使用JS在计算器中将计算固定为0？

3 个答案: