Question

我有一个发票项目，其中包含一个表单，其中包含项目名称，价格，数量和小计的输入。用户可以向表单添加多个发票行。每个发票行都相同。

我遇到的问题是.each（）正在计算class =＆＃34; line＆＃34;的实例。但只从第一行输入中获取值：service [0] = firstServ service [1] = firstServ

我希望它计算class =＆＃34; line＆＃34;的实例。并选择.line行中输入的输入值：service [0] = firstServ service [1] = secondServ

输入行

<tr class="line">
    <td class="text-center"><label class="csscheckbox csscheckbox-primary"> {{form::checkbox('tax', 1, null,  ['class' => 'tax', 'id' => 'taxable[]'])}}<span></span></label></td>
    <td><input type="text" id="serviceName" name="serviceName" class="name form-control" id="serviceName[]" placeholder="Service name"></td>
    <td class="text-right"><input type="text" class="qty form-control" id="quantity[]" placeholder="qty" value="1"/></td>
    <td class="text-right"><input type="text" class="price form-control" name="cost" id="price[]" placeholder="Price" /></td>
    <td class="text-right"><input type="text" class="subtotal form-control" id="sub[]" name="sub" value=""/></td>
</tr>

使用.each（）收集用户输入

var service = [];
    $('.line').each(function(){
        var name = $('.name').val();
        var qty = $('.qty').val();
        var price = $('.price').val();
        var subtotal = $('.subtotal').val();
           if(qty !== '') {
              obj = {};
              obj.name = name;
              obj.qty = qty;
              obj.price = price;
              obj.subtotal = subtotal;
            service.push(obj);
            }
        });

TIA求助。

Answer 1

您可以使用this使用当前上下文，然后找到其中的元素：

 var service = [];
  $('.line').each(function(){
    var name = $(this).find('.name').val();
    var qty = $(this).find('.qty').val();
    var price = $(this).find('.price').val();
    var subtotal = $(this).find('.subtotal').val();
    if(qty !== '') {
          obj = {};
          obj.name = name;
          obj.qty = qty;
          obj.price = price;
          obj.subtotal = subtotal;
        service.push(obj);
        }
    });

Answer 2

您的脚本中存在的问题是，您始终使用name或price等类定位所有输入，而不是使用当前line定位元素。

您可以采用的一种方法是使用.map（） - 请注意使用this仅过滤当前.line

中的元素

var service = $('.line').map(function () {
    var $this = $(this);
    var qty = $this.find('.qty').val();
    return qty === '' ? undefined : {
        name: $this.find('.name').val(),
        qty: qty,
        price: $this.find('.price').val(),
        subtotal: $this.find('.subtotal').val()
    }
}).get();

使用.each（）迭代类内的输入

2 个答案: