Javascript 在所选下拉列表的两个值之间计算？

如何从两个选定下拉列表中计算值并显示在文本框中

我还想计算自动不买点击按钮。

Html代码 保险：

<select class="form-control" name="insurance" onchange="calcVals()" id="insurance">
   <option disabled="" selected="" ></option>
   <option value="200">Yes</option>
   <option value="0">No </option>
</select>

---

没有id“insurance”的选择器，因此必须使用“getElementsByName”而不是getElementsById

请尝试以下代码：

 <select class="form-control" name="insurance" id="insurance" onchange="calcVals()">
  <option disabled="" selected=""></option>
  <option value="200">Yes</option>
  <option value="0">No </option>
</select>

Manpower:

<select class="form-control" name="manpower" id="manpower" onchange="calcVals()">
  <option disabled="" selected=""></option>
  <option value="150">1</option>
  <option value="300">2</option>
  <option value="450">3</option>
  <option value="600">4</option>
  <option value="750">5</option>
</select>

Textbox :

<input name="totalAmount" id="totalAmount" type="text" readonly>

<script>
function calcVals() {
    var e = document.getElementById("manpower");
    var selFrst = e[0].value;
    var f = document.getElementsByName("insurance");
    var selScnd = f[0].value;

    var totalCal = parseInt(selFrst) + parseInt(selScnd);
    document.getElementById("totalAmount").value = totalCal;
 }
</script>

对
不
人力：
1.
2.
3.
4.
5.
文本框：
函数calcVals（）{
var e=document.getElementById（“人力”）；
var selFrst=e[0]。值；
var f=document.getElementsByName（“保险”）；
var selScnd=f[0]。值；
var totalCal=parseInt（selFrst）+parseInt（selScnd）；
document.getElementById（“totalAmount”）.value=totalCal；
}

首先，将

id=“保险”

添加到保险选项中

其次，如果要添加值，则需要值

函数calcVals（）{
var e=document.getElementById（“人力”）；
var f=document.getElementById（“保险”）；
var selFrst=e.options[e.selectedIndex]。值；
var selScnd=f.options[f.selectedIndex].value；
var totalCal=+selFrst++selScnd；
document.getElementById（“totalAmount”）.value=totalCal；
}

对
不
人力：
1.
2.
3.
4.
5.
文本框：

试试下面的方法，您缺少一些东西，我们必须使用parseInt将字符串转换为整数

函数calcVals（）{
var e=document.getElementById（“人力”）；
var selFrst=e.options[e.selectedIndex]。值；
var f=document.getElementById（“保险”）；
var selScnd=f.options[f.selectedIndex].value；
var totalCal=parseInt（selFrst）+parseInt（selScnd）；
document.getElementById（“totalAmount”）.value=totalCal；
}

对
不
1.
2.
3.
4.
5.

getElementById（“保险”）您没有这样的元素顺便问一下，您是否希望输出类似于
no 1
或
no 2
<代码>否5

或

是1

或

是2

Yes5

？忘了编辑它，顺便说一句，总数不是+，它显示“5Yes”@bravonope类似于1+1=“2”，所以，您确实希望显示带空格的“No n”或不带空格的“Yesn”（其中n是1到5）

getElementsByName

返回一个

节点列表

-所以，你的代码同样错误，现在你正在将一个下拉文本添加到另一个下拉值中….:preally？所以你确实意识到人力值是150、300、450、600和750…而不是1、2、3、4、5是的，@balamurugana没有指定任何关于值或文本的内容。所以我更喜欢值文本的ead…

我确实更喜欢值而不是文本

但是…你可以用text解释你必须在变量前面加“+”来计算@bravo，它是parseFloat的缩写…即在大多数情况下

+string

和

parseFloat（string）

是相同的…在这种情况下，由于所有值都很容易强制为数字，所以它只是code@Bravo，+表示

parseInt

或

parseFloat

？两者都不是，但它就像parseFloat一样-在您的情况下，这并不重要（您知道javascript只有数字类型，而不是int或float？）

<input name="totalAmount" id="totalAmount" type="text"  readonly>

    function calcVals() {
    var e = document.getElementById("manpower");
    var selFrst = e.options[e.selectedIndex].text;
    var f = document.getElementById("insurance");
    var selScnd = f.options[f.selectedIndex].text;

    var totalCal = selFrst + selScnd;
    document.getElementById("totalAmount").value = totalCal;
 }

 <select class="form-control" name="insurance" id="insurance" onchange="calcVals()">
  <option disabled="" selected=""></option>
  <option value="200">Yes</option>
  <option value="0">No </option>
</select>

Manpower:

<select class="form-control" name="manpower" id="manpower" onchange="calcVals()">
  <option disabled="" selected=""></option>
  <option value="150">1</option>
  <option value="300">2</option>
  <option value="450">3</option>
  <option value="600">4</option>
  <option value="750">5</option>
</select>

Textbox :

<input name="totalAmount" id="totalAmount" type="text" readonly>

<script>
function calcVals() {
    var e = document.getElementById("manpower");
    var selFrst = e[0].value;
    var f = document.getElementsByName("insurance");
    var selScnd = f[0].value;

    var totalCal = parseInt(selFrst) + parseInt(selScnd);
    document.getElementById("totalAmount").value = totalCal;
 }
</script>