Question

我编写了一个计算器，当您单击按钮插入文本时，它不会在框中插入文本。请帮助我找到问题。这是代码：

<html>
<head>
<style type=text/css>
#calculator{
    margin-top:10%;
    margin-left:37%;
    background:cyan;
    color:black;
    height:350px;
    width:350;
    padding:50px;
    text-align:center;
    border:5px dashed blue;
}
#calculator b{
    color:black;
}

</style>
<script type="text/javascript" language="javascript">
var num1 = getElementById("number1");
var num2 = getElementById("number2").value;;
var op = getElementById("operation").value;;
var ans = getElementById("answer").value;
function type1(){
    if(num1 != ""){
        num1 = "1";
    }
}
</script>
</head>
<body>
<div id=calculator>
<center>
<table>
<tr><td><input type="text" value=""  placeholder="Number 1"  id="number1"   readonly="readonly" maxlength="1" tabindex="1"/></td></tr><tr><td>
<input type="text" value=""  placeholder="Operation" id="operation" maxlength="1" readonly="readonly" tabindex="2"/></td></tr><tr><td>
<input type="text" value=""  placeholder="Number 2"  id="number2"   maxlength="1" readonly="readonly" tabindex="3"/><b>=</b></td></tr><tr><td>
<input type="text" value=""  placeholder="Answer"    id="answer"    tabindex="4"   readonly="readonly"/></td></tr>
<table>
<tr><td><input type="button" value="1" onClick="type1()"</td><td><input type="button" value="2" onClick="type2()"</td><td><input type="button" value="3" onClick="type3()"</td></tr>
<tr><td><input type="button" value="4" onClick="type4()"</td><td><input type="button" value="5" onClick="type5()"</td><td><input type="button" value="6" onClick="type6()"</td></tr>
<tr><td><input type="button" value="7" onClick="type7()"</td><td><input type="button" value="8" onClick="type8()"</td><td><input type="button" value="9" onClick="type9()"</td></tr>
<tr><td><input type="button" value="- " onClick="type-()"></td><td><input type="button" value="0" onClick="type0()"></td><td><input type="button" value="+" onClick="type+()"></td></tr>
<tr><td><input type="button" value="X" onClick="typeX()"></td><td><input type="button" value="=" onClick="type=()"></td><td><input type="button" value="/ " onClick="type/()"></td></tr>
</table>
<p><b>NOTE:</b>This widget does not support negative numbers.</p>
</center>
</div>
</body>
</html>

这里有效： http://test342.coffeecup.com/LearningJavascript.html 谢谢你的帮助！

Answer 1

1 将var num1 = getElementById("number1");替换为var num1 = getElementById("number1").value;

对于其他按钮，没有为它们定义任何功能。

2 将getElementById替换为document.getElementById（只需添加此内容， Bigood 首先使用它。）

Answer 2

首先，getElementById()是document对象的方法。

改为使用document.getElementById()（see reference）。

其次，你不应该为每个按钮声明一个函数：你宁愿为每种类型的交互使用一个函数，如 number 和 operation 。

然后，在onclick属性中，使用正确的函数进行调用，并在操作完成后更改聚焦输入。

第三，不要使用分号两次，它不是更安全：）

为什么这个按钮不会改变文本框？

2 个答案: