Javascript JQuery：如何在一个非常大的HTML文件上唯一地为单个选择器赋值？

我对JQuery非常陌生，所以如果这是一个愚蠢的问题，请道歉

所以我有一张订单。我的Javascript执行以下简单的算法：价格x数量=成本

$(".quantity").on('change', function(){
    var quantity = parseInt($(this).val());
    var num = (price * quantity);
    var cost = num.toFixed(2);
    $('.cost').val(cost);
});

然而，HTML订单表单有35+个潜在行，每行有一个“成本”输入字段

我可以给每个成本域它自己的唯一ID，但是我的JS变成了一场噩梦。但是，如果我只是使用HTML类或ID分配“cost”，那么当然每一行都会得到相同的值，这是行不通的：

   $('.cost').val(cost);  // This gives the same value to every input field. 

问题：有没有一种方法可以分配它，它只影响单个相关输入字段，而不影响每个输入具有唯一ID的所有JS的母亲

然而，HTML订单表单有35+个潜在行，每行有一个“成本”输入字段

抓住行，循环浏览，找出成本。

$

函数中的第二个参数将搜索限制为仅搜索其子代，而不是全局搜索

$('tr').each(function(){
  var cost = $('.cost', this);
  // do stuff
});

---

有许多可能的解决方案，但一个简单的方法是找到下一个

.cost

元素。例如：

$(".quantity").on('change', function(){
    var quantity = parseInt($(this).val());
    var num = (price * quantity);
    var cost = num.toFixed(2);

    // If the next element is a 'cost' element
    $(this).next('.cost').val(cost);

    // or if the 'cost' element isn't the next sibling,
    // the cost element who has the same parent (e.g. same <tr> or <div>)
    $(this).parent().children('.cost').val(cost);
});

// Tags like this: 
<input class='quantity' data-cost-field='cost1' ... >

// With javascript like this: 
var costFieldId = $(this).data('costField');
$('#'+costFieldId).val(cost);