如何通过使用类选择器和jQuery库在表的输入元素中调用某些值？

Cootel Kh 发表于 Dev

库特尔

我不能通过使用siblings（）和Jquery从表HTML标记中的输入中调用值来计算并将结果发送到结果选择器。

此原因可能来自Siblings（）方法，但我不知道应该使用哪种方法通过使用类选择器从表中选择值。

这是HTML标记

<table class="table table-condensed">
     <thead>
         <tr>
             <td><strong>No</strong></td>
             <td><strong>DESCRIPTION</strong></td>
             <td><strong>Type</strong></td>
             <td><strong>QUANTITY</strong></td>
             <td><strong>UNIT PRICE</strong></td>
             <td><strong>AMOUNT (USD)</strong></td>
         </tr>
     </thead> 
<tbody>
<tr>
 <td><div><?php echo form_input('vat',set_value('',''), 'class="qty"')?> </div></td> 
 <td><div><?php echo form_input('vat',set_value('',''), 'class="unit"')?> </div></td> 
 <td><div><?php echo form_input('vat',set_value('',''), 'class="amount" readonly')?></div></td> 
                                 </tr>
 <tr> 
 <td><div><?php echo form_input('vat',set_value('',''), 'class="qty"')?></div></td> 
 <td><div><?php echo form_input('vat',set_value('',''), 'class="unit"')?> </div></td>
 <td><div><?php echo form_input('vat',set_value('',''), 'class="amount" readonly')?></div></td>
                                </tr>         
 <tr> 
 <td><div>Total</div></td>
 <td> <div><?php echo form_input('total',set_value('total',''),'class="result" readonly ')?>$</div></td>
 </tr>

这是使用Jquery库的Javascript，我尝试通过使用类选择器从表元素的输入中选择一些值，如果不使用表，我也会为我工作。

$(function () {

    $('.unit,.qty').on('change', function () {
    var unit = $(this).hasClass('unit') ? $(this).val() : $(this).siblings('.unit').val();
    var qty = $(this).hasClass('qty') ? $(this).val() : $(this).siblings('.qty').val();
    unit = unit || 0;
    qty   = qty || 0;
    var val = unit >= 1 && qty >= 1 ? parseFloat(unit * qty) : 0;
    $(this).siblings('.amount').val(val);//parent()
    var total = 0;
    var update = false;
    $('.amount').each(function () {
        val = parseFloat($(this).val()) | 0;
        total = val ? (parseFloat(total + val)) : total;
    });
    $('.result').val(total);
  });
});

</script>

我该怎么办请帮助>

罗汉·库玛（Rohan Kumar）

您可以使用closest rowlike，

$(function () {
    $('.unit,.qty').on('change', function () {
        var $tr=$(this).closest('tr'); // usae the parent row to achieve this
        var unit = $tr.find('.unit').val();
        var qty = $tr.find('.qty').val();
        unit = unit || 0;
        qty   = qty || 0;
        var val = unit >= 1 && qty >= 1 ? parseFloat(unit * qty) : 0;
        $tr.find('.amount').val(val);//parent()
        var total = 0;
        var update = false;
        $('.amount').each(function () {
            val = parseFloat($(this).val()) | 0;
            total = val ? (parseFloat(total + val)) : total;
        });
        $('.result').val(total);
    });
});