在javascript中级联onchange计算

时间:2014-09-02 12:24:17

标签: javascript html

我列出了每种材料的材料和费率。当用户输入物料的数量时,onchange事件触发并计算物料成本作为费率*数量。我能做到这一点。我也想要所有材料成本的总和。我可以通过在onchange上添加另一个javascript函数来实现,因为onchange =“mymultiply(100,'rate_1','quantity_1'); mysummation('cost_1','cost_2',...,'sum_cost')”。但是如何级联呢?

我希望javascript函数在readonly值(cost_1 / cost_2等)通过onchange在quantity_1 / quantity_2等中更改时触发.onchange仅适用于用户输入。有解决方法吗?

所以样本表格看起来像这样。

<table>
<tr><th>material</th><th>rate</th><th>quantity</th><th>cost</th></tr>
<tr>
  <td>Material 1</td>
  <td><input type='text' id='rate_1' readonly='true' value='100' /></td>
  <td><input type='text' id='quantity_1' onchange="mymultiply('rate_1','quantity_1','cost_1');" /></td>
  <td><input type='text' id='cost_1' readonly='true' onchange="mysummation('cost_1','cost_2','cost_3','sum_cost');" /></td>
</tr>
<tr> Row 2 data</tr>
<tr> Row 3 data</tr>
</table>

<input type='text' id='sum_cost' readonly='true' />

Javascript看起来像这样......

function mymultiply(rate, quantity, cost){
  document.getElementById(cost).value=document.getElementById(quantity).value*document.getElementById(rate).value;
}

function mysummation(cost_1, cost_2, cost_3, sum){
  document.getElementById(sum).value=document.getElementById(cost_1).value+document.getElementById(cost_2).value+document.getElementById(cost_3).value;
}

1 个答案:

答案 0 :(得分:0)

你能试试吗

脚本

    <script>

    function mymultiply(quantity){
       var rate1=document.getElementById('rate_1').value;
       document.getElementById('cost_1').value= parseInt(quantity)*parseInt(rate1);
       document.getElementById('cost_2').value= parseInt(quantity)*200;
       document.getElementById('cost_3').value= parseInt(quantity)*300;
       document.getElementById('sum_cost').value= parseInt(document.getElementById('cost_1').value)+parseInt(document.getElementById('cost_2').value)+parseInt(document.getElementById('cost_3').value);
    }

    </script>

HTML

    <table>
    <tr><th>material</th><th>rate</th><th>quantity</th><th>cost1</th><th>cost2</th><th>cost3</th></tr>
    <tr>
      <td>Material 1</td>
      <td><input type='text' id='rate_1' readonly='true' value='100' /></td>
      <td><input type='text' id='quantity_1' onKeyUp="mymultiply(this.value);" /></td>
      <td><input type='text' id='cost_1' readonly='true' /></td>
      <td><input type='text' id='cost_2' readonly='true' /></td>
      <td><input type='text' id='cost_3' readonly='true' /></td>
    </tr>
    <tr> Row 2 data</tr>
    <tr> Row 3 data</tr>
    </table>

    Totla Value<input type='text' id='sum_cost' readonly='true' />

我想你想从另一个函数触发一个函数试试这个

$(selector).trigger("change"); 

当你调用它的

 function mymultiply(rate, quantity, cost){
   mysummation('100', '200', '300', '600');//call another function also
 }