)表单中提供文本框、按钮,可以让用户输入1-5个成绩,(个数不确定,可以字符串形式,也可以一个个输入方式)
时间: 2023-06-13 19:02:49 浏览: 54
您可以使用HTML和JavaScript来创建一个允许用户输入1-5个成绩的表单。以下是一个示例代码:
```html
<!DOCTYPE html>
<html>
<head>
<title>成绩输入表单</title>
</head>
<body>
<p>请输入1-5个成绩(用逗号分隔):</p>
<input type="text" id="grades">
<button onclick="submitGrades()">提交</button>
<p id="result"></p>
<script>
function submitGrades() {
var grades = document.getElementById("grades").value.split(",");
var numOfGrades = grades.length;
if (numOfGrades > 5) {
document.getElementById("result").innerHTML = "最多只能输入5个成绩!";
return;
}
var totalScore = 0;
for (var i = 0; i < numOfGrades; i++) {
var grade = parseFloat(grades[i]);
if (isNaN(grade)) {
document.getElementById("result").innerHTML = "请输入数字!";
return;
}
totalScore += grade;
}
var averageScore = totalScore / numOfGrades;
document.getElementById("result").innerHTML = "平均分为:" + averageScore.toFixed(2);
}
</script>
</body>
</html>
```
该表单包括一个文本框和一个提交按钮。用户可以在文本框中以逗号分隔的形式输入1-5个成绩。在点击提交按钮后,JavaScript代码将获取文本框中的值,并将其拆分为一个成绩数组。然后,代码将检查成绩数量是否符合要求(最多只能输入5个)。接下来,代码会计算这些成绩的平均分,并在结果区域显示。如果用户输入了非数字,则会显示错误消息。