javascript - 计算每行汇率变化的金额

Question

以下是我动态生成的表格。意味着行是通过查询结果循环生成的。但我在这里显示为简单的 html 以避免混淆。

<table>
<thead>
<tr>
<th>Particulars</th>
<th>Packing</th>
<th>Quantity</th>
<th>Rate</th>
<th>Amount</th>
</tr>
</thead>
<tr>
<td>1</td>
<td>1</td>
<td>
 <input type='text' class='quantity' style='width:80%;' readonly='' value='".$row->quantity."'/> 
</td>
<td><input type="text" name="rate"></td>
<td><input type='text' style='width:100%;' class='amount' readonly=''/></td>
</tr>
<tr>
<td>1</td>
<td>1</td>
<td>
<input type='text' class='quantity' style='width:80%;' readonly='' value='".$row->quantity."'/>
</td>
<td><input type="text" name="rate"></td>
<td><input type='text' style='width:100%;' class='amount' readonly=''/></td>
 </tr>
<tr>
<td>1</td>
<td>1</td>
<td>
<input type='text' class='quantity' style='width:80%;' readonly='' value='".$row->quantity."'/>
</td>
<td><input type="text" name="rate"></td>
<td><input type='text' style='width:100%;' class='amount' readonly=''/> </td>
</tr>
</table>

每一行的速率和数量都会不同。所以我想要数量和费率的值，并将它们相乘并在相应的 td 输入框中显示金额。问题是用户要为每行输入费率，然后金额输入框中只会显示金额。那么我该怎么做呢？使用jquery或使用rate div的模糊事件或任何其他方式来做到这一点？

Answer 1

您需要检查速率输入字段的模糊度。每次模糊时，使用适当的选择器获取数量值。使用其他函数可以更轻松地完成此操作，尝试研究它。您需要验证每个输入检查它是否有效。希望能帮助你配合..:)

$('input[name=rate]').on('blur',function(){
       var rate=$(this).val();
       var quantity = $(this).parent().parent().find('.quantity').val();
       var amount = rate*quantity;
       $(this).parent().parent().find('.amount').val(amount);
    });

fiddle here

仅供引用

而不是复制粘贴代码。尝试阅读更多正在使用的函数，伙计..

blur()

selectors

parent()