0

如何将Qty文本框与Price文本框相乘然后在文本框上打印输出Subtotal?然后添加文本框的总数并使用按键事件Subtotal在文本框上打印总和。Total Price

<ul>
<li>
    Qty<input type="text" name="item_qty0" id="item_qty0" class="item_qty valid" onkeypress="return calProduct(this);" value="1" autocomplete="off" />
    Price<input type="text" name="item_price0" id="item_price0" class="item_price valid" onkeypress="return calProduct(this);" value="0" autocomplete="off" />
    Subtotal<input type="text" name="item_subtotal0" id="item_subtotal0" class="item_subtotal" disabled="" />
</li>
<li>
     Qty<input type="text" name="item_qty1" id="item_qty1" class="item_qty valid" onkeypress="return calProduct(this);" value="1" autocomplete="off" />
    Price<input type="text" name="item_price1" id="item_price1" class="item_price valid" onkeypress="return calProduct(this);" value="0" autocomplete="off" />
    Subtotal<input type="text" name="item_subtotal1" id="item_subtotal1" class="item_subtotal" disabled="" />           
</li>
</ul>
    <hr />
<p style="text-align:right;">
    Total Price<input name="total_price" maxlength="15" type="text" id="totalPrice" />
</p>

演示

4

2 回答 2

3

这是工作演示 http://jsfiddle.net/WLSND/

$("input").keyup(function(){
      var total = 0;
    $('.item_subtotal').each(function (index, element) {
      var subtotal = parseInt($(this).parent().find(".item_qty").val())*parseInt($(this).parent().find(".item_price").val()) ;
      $(this).val(subtotal);
      total = total + subtotal;     
    });
    $("#totalPrice").val(total);   
于 2013-06-14T12:15:47.410 回答
1
$('input').keyup(function(){
    var v = this.value, el = $(this);
    if(!isNaN(v)){
        var ov = el.siblings('.valid').val();        
        el.siblings().last().val(v*ov);
        $(this).removeClass('nope').trigger('totalChange');
    } else {
       $(this).addClass('nope');
    }
});

$(document).on('totalChange', function(){
    var sub1 = parseFloat($('#item_subtotal').val(), 10);
    var sub2 = parseFloat($('#item_subtotal2').val(), 10);
    $('#totalPrice').val(sub1+sub2);
});

小提琴

HTML我还对有关IDs进行了一些更改

于 2013-06-14T11:56:29.443 回答