我需要显示一个文本字段和一个按钮“生成时间表”。当用户输入 1 到 9 之间的整数并单击按钮时，相应的 2 个乘法表将并排出现。时代 右侧的表格必须显示为有序列表，左侧的表格将仅显示没有项目符号的列表。
当用户输入另一个数字并单击按钮时，旧的乘法表消失，并且 新的时间表将相应生成。
我尝试过这样做，但我只能设法显示每个乘法表的第一个方程。请帮忙。顺便说一句，我是 Javascript 新手，所以放轻松 x
<html>
<head>
</head>
<body>
Enter an integer from 1 to 9:
<input id="integer" type="text">
<button onclick="table()">Generate times table</button>
<p id="display"></p>
<script>
function table(){
var integerInput = document.getElementById("integer");
var integer = Number(integerInput.value);
var display;
if (integer == 1){
display = integer;
var displayField = document.getElementById("display");
displayField.innerHTML = "1 x 1 = 1";
}
else if (integer == 2){
display = integer;
var displayField = document.getElementById("display");
displayField.innerHTML = "2 x 1 = 2";
}
else if (integer == 3){
display = integer;
var displayField = document.getElementById("display");
displayField.innerHTML = "3 x 1 = 2";
}
else if (integer == 4){
display = integer;
var displayField = document.getElementById("display");
displayField.innerHTML = "4 x 1 = 4";
}
else if (integer == 5){
display = integer;
var displayField = document.getElementById("display");
displayField.innerHTML = "5 x 1 = 5";
}
else if (integer == 6){
display = integer;
var displayField = document.getElementById("display");
displayField.innerHTML = "6 x 1 = 6";
}
else if (integer == 7){
display = integer;
var displayField = document.getElementById("display");
displayField.innerHTML = "7 x 1 = 7";
}
else if (integer == 8){
display = integer;
var displayField = document.getElementById("display");
displayField.innerHTML = "8 x 1 = 8";
}
else if (integer == 9){
display = integer;
var displayField = document.getElementById("display");
displayField.innerHTML = "9 x 1 = 9";
}
}
</script>
</body>
</html>
最佳答案
这是一个使用简单 for 循环的示例。目前它的时间表最多为 12 个，但是更改循环条件将允许您更改输出的次数。
function table(){
var integerInput = document.getElementById("integer");
var integer = Number(integerInput.value);
var displayField = document.getElementById("display");
//Reset the innerHTML when a new integer is inserted
displayField.innerHTML = "";
//Loop from 1 -> 12
for(let i = 1; i <= 12; i++) {
//Append the current times table to the HTML
displayField.innerHTML += `${integer} x ${i} = ${integer*i}<br>`
}
}<html>
<body>
Enter an integer from 1 to 9:
<input id="integer" type="text">
<button onclick="table()">Generate times table</button>
<p id="display"></p>
</body>
</html>关于javascript - 在 JavaScript 中单击按钮时如何显示列表？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57984670/