Javascript 如何将按钮输入显示在文本区域 在线计算器
我在做一个计算器。如何从文本区域上的按钮显示进行输入？我必须让数字像普通计算器一样显示在文本区域。我不能使用jquery，因为我们还没有学会它。要将数字添加到文本区域，可以使用以下代码：Javascript 如何将按钮输入显示在文本区域 在线计算器,javascript,Javascript,我在做一个计算器。如何从文本区域上的按钮显示进行输入？我必须让数字像普通计算器一样显示在文本区域。我不能使用jquery，因为我们还没有学会它。要将数字添加到文本区域，可以使用以下代码： <body> <center> <h1>Online Calculator</h1> <hr/> <form name="frmCalculator" action=""> <table border="1" cellpadd
<body>
<center>
<h1>Online Calculator</h1>
<hr/>
<form name="frmCalculator" action="">
<table border="1" cellpadding="1" cellspacing="1" width="30%">
<tr>
<td colspan="4"><textarea style="width:100%" name="txtResult"></textarea></td>
</tr>
<tr>
<td colspan="4"><input type="reset" style="width:100%"/></td>
</tr>
<tr>
<td><input type="button" value=" 7 " onclick="7"/></td>
<td><input type="button" value=" 8 " onclick="8"/></td>
<td><input type="button" value=" 9 " onclick="9"/></td>
<td><input type="button" value=" + " onclick="plus()"/></td>
</tr>
<tr>
<td><input type="button" value=" 4 " onclick="4"/></td>
<td><input type="button" value=" 5 " onclick="5"/></td>
<td><input type="button" value=" 6 " onclick="6"/></td>
<td><input type="button" value=" - " onclick="subtract()"/></td>
</tr>
<tr>
<td><input type="button" value=" 1 " onclick="1"/></td>
<td><input type="button" value=" 2 " onclick="2"/></td>
<td><input type="button" value=" 3 " onclick="3"/></td>
<td><input type="button" value=" * " onclick="times()"/></td>
</tr>
<tr>
<td><input type="button" value=" 0 " onclick="0"/></td>
<td><input type="button" value=" . " onclick="."/></td>
<td><input type="button" value=" = " onclick="total()"/></td>
<td><input type="button" value=" / " onclick="divide()"/></td>
</tr>
</table>
</form>
</center>
</body>
var-button=document.querySelectorAll（'input[type=button]”）；
对于（var x=0；x简单来说，您可以执行以下操作：
<center>
<h1>Online Calculator</h1>
<hr/>
<form name="frmCalculator" action="">
<table border="1" cellpadding="1" cellspacing="1" width="30%">
<tr>
<td colspan="4"><textarea style="width:100%" id="txt" name="txtResult"></textarea></td>
</tr>
<tr>
<td colspan="4"><input type="reset" style="width:100%"/></td>
</tr>
<tr>
<td><input type="button" value="7"/></td>
<td><input type="button" value="8"/></td>
<td><input type="button" value="9"/></td>
<td><input type="button" value="+" /></td>
</tr>
<tr>
<td><input type="button" value="4" /></td>
<td><input type="button" value="5" /></td>
<td><input type="button" value="6" /></td>
<td><input type="button" value="-" /></td>
</tr>
<tr>
<td><input type="button" value="1" /></td>
<td><input type="button" value="2"/></td>
<td><input type="button" value="3" /></td>
<td><input type="button" value="*" /></td>
</tr>
<tr>
<td><input type="button" value="0" /></td>
<td><input type="button" value="." /></td>
<td><input type="button" value="="/></td>
<td><input type="button" value="/" /></td>
</tr>
</table>
</form>
</center>
但是，您可能希望为每个按钮添加一个侦听器，该按钮是一个执行相同操作的数字。最简单的方法是向数字按钮添加一个类，并为它们提供所有相同的侦听器，因此：
<input type="button" value="7" onclick="this.form.txtResult.value = this.value">
并使用load事件添加侦听器：
<input type="button" value="7" class="numberButton">
window.onload=function（）{
var buttons=document.queryselectoral（'.numberButton'）；
对于（var i=0，iLen=buttons.length；iAdd）侦听器，它读取值并将其写入textarea。到目前为止，您尝试了什么？类似于this.form.txtreult.value=this.value的内容可能会让您开始。我尝试使用onclick事件写入textarea。我假设如果我指定onclick=“4”这是可行的。onclick属性的值被解释为javascript。“4”只是一个数字，它没有任何作用。用前面注释中的代码替换它。您可以执行类似于onclick=“5”或onclick=“6”等操作，而不是onclick=“displayNumber（5）”
或onclick=“displayNumber（6）”
etc…其中displayNumber是一个函数，用于接收数字并更改文本区域的值…请注意，在a+parseInt（this.value）
中，使用parseInt是毫无意义的。this.value
是一个字符串开头，因此+
运算符将转换parseInt（this.value）的结果
返回到字符串，然后将其附加到a的值，就好像没有使用parseInt一样。@RobG实际上必须使用它，我也一直在想。OP的值数据中有很多空格，可以不使用parseInt打印出来，这是因为OP使用该值来设置按钮的大小。该值应该设置为所需的值e和样式用于设置按钮的大小。没错，我会在我的回答@RobG中提到这一点
<input type="button" value="7" class="numberButton">
window.onload = function() {
var buttons = document.querySelectorAll('.numberButton');
for (var i=0, iLen=buttons.length; i<iLen; i++) {
buttons[i].onclick = function(){
this.form.txtResult.value += this.value;
};
}
};