我正在尝试计算一组函数的小计,但没有得到输出:

时间:2018-11-05 01:22:12

标签: javascript html css

我的html看起来像这样:

    <tr>
      <td><input id="z1" type="number"  
      oninput="calculateSubTotal()">
      </td>
      <td>Shirts - WASH - Qty 1 to 4</td>
      <td>2.50 ea</td>
      <td></td>
    </tr>

我的js看起来像这样:

function calculateSubTotal() { 
 var subTotal = (getTableOnePrice() + getTableTwoPrice() + getTableThreePrice() + getTableFourPrice());
 document.getElementById("subtotal").innerHTML = subTotal.toFixed(2);
 return subTotal;
}

其中一个功能如下:

function getTableTwoPrice(){    

var ba = document.getElementById("y1").value * 6.00;

var bb = document.getElementById("y2").value * 1.25;

var bc = document.getElementById("y3").value * 4.00;

var bd = document.getElementById("y4").value * 6.00;

var be = document.getElementById("y5").value * 7.00;

var bf = document.getElementById("y6").value * 8.00;

var bg = document.getElementById("y7").value * 9.00;

var bh = document.getElementById("y8").value * 5.00;

var bi = document.getElementById("y9").value * 13.00;

var bj = document.getElementById("y10").value * 10.00;

var bk = document.getElementById("y11").value * 12.00;

var bl = document.getElementById("y12").value * 14.00;

var bm = document.getElementById("y13").value * 16.00;

var bn = document.getElementById("y14").value * 10.00;

var tableTwoTotal = ba + bb + bc + bd + be + bf + bg + bh + bi + bj + bk + bl + bm + bn;

   return tableTwoTotal;
 }

2 个答案:

答案 0 :(得分:0)

尝试onchage事件。我发现oninput在某些情况下不起作用。

答案 1 :(得分:0)

我将重点放在首先将一些内容写入屏幕上。是的,onchange是您想要的,因为每次击键时oninput都会发生变化。

<tr>
      <td><input id="z1" type="number" onchange="calculateSubTotal()">
      </td>
      <td>Shirts - WASH - Qty 1 to 4</td>
      <td>2.50 ea</td>
      <td></td>
    </tr>
    <div id='subtotal'></div>

 <script>   
    function calculateSubTotal() { 
    var subTotal = getTableOnePrice();
    document.getElementById("subtotal").innerHTML = subTotal.toFixed(2);
    return subTotal;
    }
    function getTableOnePrice(){
        return 5
    }
</script>

一旦您进行了类似的工作,就可以添加真正的getTableOnePrice(),然后再添加所有其他内容。