如何获取用户点击数字按钮时显示文本框中显示的数字?我不知道要在我的 numInputF()
函数中放入什么,我想使用 for-loop 函数,但我不知道如何。
<script>
var initialMoney = 1000; //Customer's initial money is $1000
var display;
/* Set the "Type amount and select operation to blank." */
function setBlankF(){
document.getElementById("display").value = "";
}
/* Gets the user input when buttons are clicked. */
function numInputF(){
}
这是我的 body 部位。我知道我应该在 onclick 按钮上放一些东西,但我还没有想出如何实现我的功能,这就是为什么它是空白的。
<table border="1">
<caption>ATM 360</caption>
<tr>
<td colspan="4">
<input type="text" id="display" value="Type amount and select operation" size="30" onclick="setBlankF()">
</td>
</tr>
<tr>
<td>
<input type="button" value="1" onclick="">
</td>
<td>
<input type="button" value="2" onclick="">
</td>
<td>
<input type="button" value="3" onclick="">
</td>
<td>
<input type="button" value="Withdrawal" id="withdraw" onclick="">
</td>
</tr>
<tr>
<td>
<input type="button" value="4" onclick="">
</td>
<td>
<input type="button" value="5" onclick="">
</td>
<td>
<input type="button" value="6" onclick="">
</td>
<td>
<input type="button" value="Deposit" id="deposit" onclick="">
</td>
</tr>
<tr>
<td>
<input type="button" value="7" onclick="">
</td>
<td>
<input type="button" value="8" onclick="">
</td>
<td>
<input type="button" value="9" onclick="">
</td>
<td>
<input type="button" value="Retype" id="retype" onclick="">
</td>
</tr>
<tr>
<td>
</td>
<td>
<input type="button" value="0" onclick="">
</td>
<td>
</td>
<td>
<input type="button" value="End" id="end" onclick="">
</td>
</tr>
</table>
提前谢谢你。
最佳答案
首先将点击事件附加到所有按钮,因此使用 .querySelectorAll()
获取所有具有 type=button
的按钮元素,然后循环遍历它们并一一选择buttons[i]
并使用 .addEventListener
附加点击事件 此点击将引导我们进入传递参数中定义的函数 numInputF
:
var buttons = document.querySelectorAll('[type="button"]');
for(var i=0;i<buttons.length;i++){
buttons[i].addEventListener("click", numInputF, false);
}
然后在您的函数中您可以获得如下值:
function numInputF(){
alert(this.value);
}
希望这对您有所帮助。
var buttons = document.querySelectorAll('[type="button"]');
for(var i=0;i<buttons.length;i++){
buttons[i].addEventListener("click", numInputF, false);
}
function numInputF(){
alert(this.value);
}
<table border="1">
<caption>ATM 360</caption>
<tr>
<td colspan="4">
<input type="text" id="display" value="Type amount and select operation" size="30" onclick="setBlankF()">
</td>
</tr>
<tr>
<td>
<input type="button" value="1" onclick="">
</td>
<td>
<input type="button" value="2" onclick="">
</td>
<td>
<input type="button" value="3" onclick="">
</td>
<td>
<input type="button" value="Withdrawal" id="withdraw" onclick="">
</td>
</tr>
<tr>
<td>
<input type="button" value="4" onclick="">
</td>
<td>
<input type="button" value="5" onclick="">
</td>
<td>
<input type="button" value="6" onclick="">
</td>
<td>
<input type="button" value="Deposit" id="deposit" onclick="">
</td>
</tr>
<tr>
<td>
<input type="button" value="7" onclick="">
</td>
<td>
<input type="button" value="8" onclick="">
</td>
<td>
<input type="button" value="9" onclick="">
</td>
<td>
<input type="button" value="Retype" id="retype" onclick="">
</td>
</tr>
<tr>
<td>
</td>
<td>
<input type="button" value="0" onclick="">
</td>
<td>
</td>
<td>
<input type="button" value="End" id="end" onclick="">
</td>
</tr>
</table>
关于javascript - 如何使用函数(for-loop)从按钮获取用户输入以显示在文本框中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40497807/