通过selectpicker自动插入输入表单

Question

我想通过selectpicker自动输入，然后计算该表单，但下面的代码不是自动输入，除非我先单击输入表单，计算javascript正在工作，但我想让输入价格在我选择包时自动具有值& 行程无需先点击输入表格。抱歉我的英语语法不好，我刚刚开始学习编程。谢谢，这是我的代码如下：超文本标记语言<label>Package</label><select  onblur="findTotal()" class="selectpicker" id="package">  <option value="" disabled selected>Select package...</option>  <option value="Engagement">Engagement</option>  <option value="Wedding">Wedding</option>  <option value="Other">Other</option></select><br/><label>Trip</label><select  onblur="findTotal()" class="selectpicker" id="trip">  <option value="" disabled selected>Select trip...</option>  <option value="shorttrip">Short Trip</option>  <option value="longttrip">Long Trip</option></select><br/><br/><label>Package Price</label><input onblur="findTotal()" type="text" name="qty" id="packageprice" placeholder="autoinput by selectpicker" /><br/><label>Trip Price</label><input onblur="findTotal()" type="text" name="qty" id="tripprice" placeholder="autoinput by selectpicker" /><br/><label>Tip</label><input onblur="findTotal()" type="text" name="qty" placeholder="manual input"  /><br/><br/><label>Total Price</label><input type="text" name="result" id="total" />脚本语言function findTotal(){    var arr = document.getElementsByName('qty');    var tot=0;    var paket = document.getElementById('package').value;    var trp = document.getElementById('trip').value;        for(var i=0;i<arr.length;i++){        if(parseInt(arr[i].value))            tot += parseInt(arr[i].value);    }        if (paket == "Engagement") {        document.getElementById('packageprice').value = "1000";    } else if (paket == "Wedding") {      document.getElementById('packageprice').value = "2000";    } else {      document.getElementById('packageprice').value = "0";    }或者您可以在此处查看 JS Fiddle 上的代码： http: //jsfiddle.net/ryh7vpwa/5/

Answer 1

您应该在实现 findTotal 函数的元素上使用oninput而不是onblur

<select  oninput="findTotal()" class="selectpicker" id="package">

  <option value="" disabled selected>Select package...</option>

  <option value="Engagement">Engagement</option>

  <option value="Wedding">Wedding</option>

  <option value="Other">Other</option>

</select>

<br/>

<label>Trip</label>

<select  oninput="findTotal()" class="selectpicker" id="trip">

  <option value="" disabled selected>Select trip...</option>

  <option value="shorttrip">Short Trip</option>

  <option value="longttrip">Long Trip</option>

</select>