从id元素传递值并计算价格

1. 如前所述，缺少*
2. getElementById为单数
3. 使用onChange并将其添加为容器上的eventListener，添加了好处，任何更改都会触发计算
4. 你没有告诉我们在不同的if中所需要的操作，你也错过了另一个
5. onkeyup="total()"不存在，它应该做什么

注意，我使用一元+运算符将值强制转换为数字，如果未定义，则使用0

document.querySelector('.container').addEventListener('change', function() {
const com = +document.getElementById('complex').value || 0;
const subject = +document.getElementById('subject').value || 0;
const n_q = +document.getElementById('number_quiz').value || 0;
const total = (com + subject) * n_q;
if (subject == 5 && com == 10) {
// ...
} else if (subject == 7 && com == 10) {
// ...
} else if (subject == 5 && com == 20) {
// ...
} else if (subject == 7 && com == 20) {
// ...
}
document.getElementById('total').value = total;
});

<div class="container py-5">
<div class="row py-3">
<div class="col-sm-4">
<label>Subject</label>
</div>
<div class="col-sm-4">
<select class="form-control" name="subject" id="subject">
<option default="">Select Subject</option>
<option value="5">Subject A</option>
<option value="7">Subject A</option>
</select>
</div>
</div>
<div class="row py-3">
<div class="col-sm-4">
<label>Complexity</label>
</div>
<div class="col-sm-4">
<select class="form-control" name="complex" id="complex">
<option default>Select Complexity</option>
<option value="10">Complex Question</option>
<option value="20">Non Complex Question</option>
</select>
</div>
</div>
<div class="row py-3">
<div class="col-sm-4">
<label>Number of questions</label>
</div>
<div class="col-sm-4">
<input type="number" name="number_quiz" id="number_quiz" max="9999" min="1" class="form-control">
</div>
</div>
<div class="row py-3">
<div class="col-sm-4">
<label>Total Net</label>
</div>
<div class="col-sm-4">
<input type="text" readonly id="total" name="total" class="form-control bg-white border-0">
</div>
</div>
<div class="row py-3">
<div class="col-sm-4">
</div>
<div class="col-sm-4">
<input type="submit" class="btn btn-danger btn-lg w-50 rounded-pill">
</div>
</div>
</div>

function price()
{
var com = document.getElementById('complex').value;
var subject = document.getElementById('subject').value;
var n_q = document.getElementById('number_quiz').value;
if (subject == 5 && com == 10)
{
var total = (com + subject)*n_q;
document.getElementById('total').value = total;
}
else if (subject == 7 && com == 10) {
var total = (com + subject)*n_q;
document.getElementById('total').value = total;
}
if (subject == 5 && com == 20)
{
var total = (com + subject)*n_q;
document.getElementById('total').value = total;
}
else if (subject == 7 && com == 20) {
var total = (com + subject)*n_q;
document.getElementById('total').value = total;
}

}

<div class="container py-5">
<div class="row py-3">
<div class="col-sm-4">
<label>Subject</label>
</div>
<div class="col-sm-4">
<select class="form-control" name="subject" id="subject" onclick="price()">
<option default="">Select Subject</option>
<option value="5">Subject A</option>
<option value="7">Subject A</option>
</select>
</div>
</div>
<div class="row py-3">
<div class="col-sm-4">
<label>Complexity</label>
</div>
<div class="col-sm-4">
<select class="form-control" name="complex" id="complex" >
<option default>Select Complexity</option>
<option value="10">Complex Question</option>
<option value="20">Non Complex Question</option>
</select>
</div>
</div>
<div class="row py-3">
<div class="col-sm-4">
<label>Number of questions</label>
</div>
<div class="col-sm-4">
<input type="number" name="number_quiz" id="number_quiz" max="9999" min="1" class="form-control">
</div>
</div>

<div class="row py-3">
<div class="col-sm-4">
<label>Total Net</label>
</div>
<div class="col-sm-4">
<input type="text" readonly="readonly" id="total"  name="total" class="form-control bg-white border-0">
</div>
</div>
<div class="row py-3">
<div class="col-sm-4">

</div>
<div class="col-sm-4">
<input type="button" onclick="price()"  value="Submit"
class="btn btn-danger btn-lg w-50 rounded-pill">
</div>
</div>
</div>

错误1

要进行乘法运算，您需要使用*

var总计=(com+主题(*n_q；

错误2

在您的代码中，您有document.getElementsById，它应该是document.getElement ById

错误3

在total上的代码中，您在keyup上调用了一个函数total，该函数没有在javascript代码中定义

错误4

您的计算函数价格从未被称为

首先，我相信你指的是var total = (com + subject) * n_q;而不是var total = (com + subject)n_q;。

其次，所有if子句都运行相同的代码，因此可以删除所有if语句，并将代码保留为.

第三，您需要将getElementsById更改为getElementById。

function price()
{
var com = document.getElementById('complex').value;
var subject = document.getElementById('subject').value;
var n_q = document.getElementById('number_quiz').value;
var total = (com + subject) * n_q;
document.getElementById('total').value = total;
}