用表单输入10本书的价格,然后显示这10本书的最高价格、最低价格和平均价格。
时间: 2023-06-05 14:47:51 浏览: 345
您好,您可以使用一个表单来输入10本书的价格,然后通过计算来显示这10本书的最高价格、最低价格和平均价格。具体的计算方法如下:
1. 首先,您需要在表单中添加10个输入框,用于输入每本书的价格。
2. 然后,您需要在表单中添加一个按钮,用于触发计算操作。
3. 当用户点击计算按钮时,您可以使用JavaScript来获取每本书的价格,并进行计算。具体的计算方法如下:
a. 最高价格:遍历所有输入框中的价格,找到最大值。
b. 最低价格:遍历所有输入框中的价格,找到最小值。
c. 平均价格:遍历所有输入框中的价格,将它们相加并除以10。
4. 最后,您可以将计算结果显示在页面上,让用户看到这10本书的最高价格、最低价格和平均价格。
希望这些信息能对您有所帮助!
相关问题
使用javascript语言,用表单输入10本书的价格,然后显示这10本书的最高价格、最低jiage、和平均价格
可以使用如下代码实现:
```html
<!DOCTYPE html>
<html>
<head>
<title>计算书籍价格</title>
</head>
<body>
<form>
<label for="book1">书1价格:</label>
<input type="number" id="book1" required><br>
<label for="book2">书2价格:</label>
<input type="number" id="book2" required><br>
<label for="book3">书3价格:</label>
<input type="number" id="book3" required><br>
<label for="book4">书4价格:</label>
<input type="number" id="book4" required><br>
<label for="book5">书5价格:</label>
<input type="number" id="book5" required><br>
<label for="book6">书6价格:</label>
<input type="number" id="book6" required><br>
<label for="book7">书7价格:</label>
<input type="number" id="book7" required><br>
<label for="book8">书8价格:</label>
<input type="number" id="book8" required><br>
<label for="book9">书9价格:</label>
<input type="number" id="book9" required><br>
<label for="book10">书10价格:</label>
<input type="number" id="book10" required><br>
<input type="button" value="计算" onclick="calculate()"><br><br>
<label for="maxPrice">最高价格:</label>
<input type="text" id="maxPrice" disabled><br>
<label for="minPrice">最低价格:</label>
<input type="text" id="minPrice" disabled><br>
<label for="averagePrice">平均价格:</label>
<input type="text" id="averagePrice" disabled><br>
</form>
<script>
function calculate() {
// 获取输入框的值
var book1 = parseFloat(document.getElementById("book1").value);
var book2 = parseFloat(document.getElementById("book2").value);
var book3 = parseFloat(document.getElementById("book3").value);
var book4 = parseFloat(document.getElementById("book4").value);
var book5 = parseFloat(document.getElementById("book5").value);
var book6 = parseFloat(document.getElementById("book6").value);
var book7 = parseFloat(document.getElementById("book7").value);
var book8 = parseFloat(document.getElementById("book8").value);
var book9 = parseFloat(document.getElementById("book9").value);
var book10 = parseFloat(document.getElementById("book10").value);
// 计算最高价格、最低价格、平均价格
var maxPrice = Math.max(book1, book2, book3, book4, book5, book6, book7, book8, book9, book10);
var minPrice = Math.min(book1, book2, book3, book4, book5, book6, book7, book8, book9, book10);
var averagePrice = (book1 + book2 + book3 + book4 + book5 + book6 + book7 + book8 + book9 + book10) / 10;
// 将结果显示在输入框中
document.getElementById("maxPrice").value = maxPrice;
document.getElementById("minPrice").value = minPrice;
document.getElementById("averagePrice").value = averagePrice.toFixed(2);
}
</script>
</body>
</html>
```
通过上面的代码,我们可以实现一个表单,让用户输入10本书的价格,然后通过JavaScript计算这些书的最高价格、最低价格和平均价格,并将结果显示在页面上。
在表单中输入5本书的价格,用逗号隔开,显示这5本书的价格和。
如果使用HTML表单,可以这样写:
```html
<form>
<label>请输入5本书的价格(用逗号隔开):</label>
<input type="text" id="prices" name="prices">
<button type="button" onclick="calculate()">计算总价</button>
</form>
<p id="result"></p>
```
接着,使用JavaScript编写calculate函数来计算总价:
```javascript
function calculate() {
// 获取输入框中的价格字符串
var pricesStr = document.getElementById("prices").value;
// 将字符串分割成价格数组
var pricesArr = pricesStr.split(",");
// 将数组中的字符串转换成数值
for (var i = 0; i < pricesArr.length; i++) {
pricesArr[i] = parseFloat(pricesArr[i]);
}
// 计算总价
var sum = 0;
for (var i = 0; i < pricesArr.length; i++) {
sum += pricesArr[i];
}
// 显示总价
document.getElementById("result").innerHTML = "这5本书的价格总和为:" + sum.toFixed(2);
}
```
相关推荐
![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)