在 JavaScript 中单击按钮时将数字添加到递增列表不起作用
好的，所以在我的代码中，我应该输入4到15之间的数字。然后，我单击一个按钮以添加它，一旦发生这种数字，该数字将添加到年龄的总数和我创建的联盟之一中（例如，应该将其递增1，如果我输入12，如果我再次输入12，则总计会说2）。当我尝试运行代码时，它无济于事。
<html>
<head>
<title>Soccer Manager</title>
<script>
function addAge()
{
// gets the input age
var age = Number(document.getElementById("age").value);
// clears the input field
document.getElementById("age").value = "";
// checks if age is between 4 and 15
if(age >= 4 && age <= 15){
// table cell to display total number of children
var total = document.getElementById("total");
// table cell to display total number of junior
var junior = document.getElementById("junior");
// table cell to display total number of intermediate
var intermediate = document.getElementById("intermediate");
// table cell to display total number of senior
var senior = document.getElementById("senior");
// increase total number of children by 1
total.innerHTML = Number(total.innerHTML) + 1;
// if its a junior age
if(age<=7)
// increase total number of junior by 1
junior.innerHTML = Number(junior.innerHTML) + 1;
// if its a intermediate age
else if(age<=11)
// increase total number of intermediate by 1
intermediate.innerHTML = Number(intermediate.innerHTML) + 1;
// else it will be a senior age
else
// increase total number of senior by 1
senior.innerHTML = Number(senior.innerHTML) + 1;
}
// if age is not between 4 and 15 alert an error
else{
window.alert("Age should be between 4 and 15");
}
}
}
</script>
</head>
<body>
<center>
<h1>
Soccer Manager
</h1>
<div>
<table>
<tr>
<th>Total Children</th>
<td id="total">0</td>
</tr>
<tr>
<th>Junior</th>
<td id="junior">0</td>
</tr>
<tr>
<th>Intermediate</th>
<td id="intermediate">0</td>
</tr>
<tr>
<th>Senior</th>
<td id="senior">0</td>
</tr>
</table>
<input type="number" placeholder="Age" id="age">
<button onClick="addAge()">Add</button>
</div>
</center>
</body>
</html>Ok so in my code I'm supposed to enter a number between 4 and 15. Then I click a button to add it, Once that happens the number will be added to the total number of ages and to one of the leagues I have created (it should be incremented by 1, for example, if I enter a 12 it will be 1 if I enter 12 again the total will say 2). When I try and run the code it does nothing.
<html>
<head>
<title>Soccer Manager</title>
<script>
function addAge()
{
// gets the input age
var age = Number(document.getElementById("age").value);
// clears the input field
document.getElementById("age").value = "";
// checks if age is between 4 and 15
if(age >= 4 && age <= 15){
// table cell to display total number of children
var total = document.getElementById("total");
// table cell to display total number of junior
var junior = document.getElementById("junior");
// table cell to display total number of intermediate
var intermediate = document.getElementById("intermediate");
// table cell to display total number of senior
var senior = document.getElementById("senior");
// increase total number of children by 1
total.innerHTML = Number(total.innerHTML) + 1;
// if its a junior age
if(age<=7)
// increase total number of junior by 1
junior.innerHTML = Number(junior.innerHTML) + 1;
// if its a intermediate age
else if(age<=11)
// increase total number of intermediate by 1
intermediate.innerHTML = Number(intermediate.innerHTML) + 1;
// else it will be a senior age
else
// increase total number of senior by 1
senior.innerHTML = Number(senior.innerHTML) + 1;
}
// if age is not between 4 and 15 alert an error
else{
window.alert("Age should be between 4 and 15");
}
}
}
</script>
</head>
<body>
<center>
<h1>
Soccer Manager
</h1>
<div>
<table>
<tr>
<th>Total Children</th>
<td id="total">0</td>
</tr>
<tr>
<th>Junior</th>
<td id="junior">0</td>
</tr>
<tr>
<th>Intermediate</th>
<td id="intermediate">0</td>
</tr>
<tr>
<th>Senior</th>
<td id="senior">0</td>
</tr>
</table>
<input type="number" placeholder="Age" id="age">
<button onClick="addAge()">Add</button>
</div>
</center>
</body>
</html>如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
您似乎忘记在语句中添加花括号 (
})。要修复此问题，您需要在以下位置添加花括号。
请记住添加花括号以使您的 JavaScript 代码正常工作！
It looks like you forgot to add curly braces (
}) in your statements.To fix it, you need to add curly braces in the following locations.
Remember to add curly braces to make your JavaScript code work correctly!