如何添加两个文本框值并在其他文本框中显示所有行

Question

我在html中创建了表格。它会像excel表格一样显示。我想将经销商价格和数量文本框值显示在总价格中。它适用于所有行。 我的代码是......

<table id="my-table">
<tr>
   <td>Price</td>
   <td>Quantity</td>
   <td>Total</td>
</tr>
<tr>
   <td><input class="price" type="text"></td>
   <td><input class="quantity" type="text"></td>
   <td><input class="total" type="text"></td>
</tr>
<tr>
   <td><input class="price" type="text"></td>
   <td><input class="quantity" type="text"></td>
   <td><input class="total" type="text"></td>
</tr>
</table> 

我该怎么做....

Answer 1

我想你有一个像这样的表结构：

<table id="my-table">
<tr>
   <td>Price</td>
   <td>Quantity</td>
   <td>Total</td>
</tr>
<tr>
   <td><input class="price" type="text"></td>
   <td><input class="quantity" type="text"></td>
   <td><input class="total" type="text"></td>
</tr>
<tr>
   <td><input class="price" type="text"></td>
   <td><input class="quantity" type="text"></td>
   <td><input class="total" type="text"></td>
</tr>
</table>

准备好文件后，在整个表格中注册价格和数量元素的onchange事件

$(document).ready(function() {
    $('#my-table').on('change', '.price', calTotal)
                  .on('change', '.quantity', calTotal);

// find the value and calculate it

    function calTotal() {
        var $row = $(this).closest('tr'),
            price    = $row.find('.price').val(),
            quantity = $row.find('.quantity').val(),
            total    = price * quantity;

// change the value in total

        $row.find('.total').val(total)
    }

});

演示here

Answer 2

否则，如果你使用mysql查询意味着它如此简单

尝试在查询本身中添加两者，并且它适用于所有行

否则您可以使用数量模糊事件