jquery 設置 function 對每個動態添加的輸入 id 做出反應並獲取此輸入 id 號

Question

我動態添加更多輸入字段，其中訂單 ID 如下所示，orders1、orders2、orders3 等：

html_code += '<input type="text" name="orders[]" id="orders'+count+'">';

現在我有這個代碼：

$('#orders1 / 2 3').typeahead({ **//here I need to set to javascript react on all numbers dynamically**
 //mycode ...
 ordernumber = 1 / 2 3...; **//here I need to extract number**
 updater: function (obj) {
            var item = JSON.parse(obj);
            $('#orderitem' + ordernumber).val(item.tax);
            return item.name;
        }
});

1. 我應該如何設置$('#orders1 / 2 3')以便能夠對每個動態添加的輸入做出反應？
2. 我怎樣才能讓ordernumber能夠在 $('#orderitem' + ordernumber) 行上設置它？

Answer 1

更好的選擇是將 class 添加到所有動態輸入並獲取ordernumber設置data-*自定義屬性，例如：

html_code += '<input class="orders" data-number="'+ count +'" name="orders[]" id="orders'+count+'">';

然后您可以將typeahead應用於所有這些，例如：

$('.orders').each(function() {

  //here extract number
  var ordernumber = $(this).data('number');

  // here initialise typeahead
  $(this).typeahead({
    ....
  });
});

---

編輯：

將此邏輯放入 function 中，例如：

function reInit(){
    $('.orders').each(function() {

      //here extract number
      var ordernumber = $(this).data('number');

      // here initialise typeahead
      $(this).typeahead({
        ....
      });
    });
}

// Call the function initially
reInit();

並動態添加元素並將其附加到 dom 再次調用 function。

html_code += '<input class="orders" data-number="'+ count +'" name="orders[]" id="orders'+count+'">';

// I don't know how are you adding the item to dom
// but something like
$(parent).append( html_code )

// Now call the function again
reInit();