3)表单中提供文本框、按钮,可以让用户输入1-5个成绩,(个数不确定,可以字符串形式,也可以一个个输入方式) 4)按下计算按钮,提示框显示所有成绩和平均成绩
时间: 2023-06-13 18:05:01 浏览: 41
好的,这个功能可以通过HTML和JavaScript来实现。下面是一个简单的示例代码:
```html
<!DOCTYPE html>
<html>
<head>
<title>成绩计算器</title>
<script>
function calculate() {
// 获取文本框中的成绩
var scores = document.getElementById("scores").value.split(",");
// 计算平均成绩
var sum = 0;
for (var i = 0; i < scores.length; i++) {
sum += parseFloat(scores[i]);
}
var avg = sum / scores.length;
// 显示成绩和平均成绩
alert("所有成绩:" + scores.join(", ") + "\n平均成绩:" + avg.toFixed(2));
}
</script>
</head>
<body>
<h1>成绩计算器</h1>
<p>请输入1-5个成绩(用逗号分隔):</p>
<input type="text" id="scores">
<br><br>
<button onclick="calculate()">计算平均成绩</button>
</body>
</html>
```
在这个示例中,我们使用了一个文本框来让用户输入成绩,使用逗号分隔每个成绩。当用户点击按钮时,我们使用JavaScript代码来获取文本框中的成绩,并计算平均成绩。最后,我们使用提示框来显示所有成绩和平均成绩。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)