Question

我有两个Jquery函数，其中一个将在单击按钮时将新的动态行插入到表单中，而另一个函数将验证该行中的单元格。

var currentItem = 11;
$('#addnew').click(function(){
  currentItem++;
  $('#items').val(currentItem);
  var strToAdd = '<tr><td><select class="form-control select2 productSelect" name="product'+currentItem+'" id="product'+currentItem+'" style="width: 100%"> <option disabled selected value> -- select a Product -- </option>'+ <?php foreach ($productData as $product) { echo "'<option value=" . $product->product_id . ">" . $product->product_name . "</option>'+";}?> '</select> </td><td><input class="form-control quantitySelect" name="quantity'+currentItem+'" id ="quantity'+currentItem+'"type="text" /></td><td><input class="form-control"  name="freeIssue'+currentItem+'" id="freeIssue'+currentItem+'" type="text" /></td> <td align="center"><button  class="btn btn-danger" name="close" id="close" onclick="SomeDeleteRowFunction(this)"><i class="fa fa-close"></i></button></td></tr>';

  $('#data').append(strToAdd);


});

在这里，我将类名称 productSelect 作为第二个函数的标识符进行验证。但是它无法识别类，并且验证不适用于我通过上述函数添加到表单的行。

  $('.productSelect').change(function () {

  var elementID = $(this).attr("id");
  var numberPart = elementID.split("t", 2);

  if ($(this).val() != null ) {
    $('#quantity'+ numberPart[1]).prop('required',true);
  }
});

这是整个代码的样子

<script type='text/javascript'>

$(document).ready(function() {

$('.productSelect').change(function () {

  var elementID = $(this).attr("id");
  var numberPart = elementID.split("t", 2);

  if ($(this).val() != null ) {
    $('#quantity'+ numberPart[1]).prop('required',true);
  }
});

var currentItem = 11;
$('#addnew').click(function(){
  currentItem++;
  $('#items').val(currentItem);
  var strToAdd = '<tr><td><select class="form-control select2 productSelect" name="product'+currentItem+'" id="product'+currentItem+'" style="width: 100%"> <option disabled selected value> -- select a Product -- </option>'+ <?php foreach ($productData as $product) { echo "'<option value=" . $product->product_id . ">" . $product->product_name . "</option>'+";}?> '</select> </td><td><input class="form-control quantitySelect" name="quantity'+currentItem+'" id ="quantity'+currentItem+'"type="text" /></td><td><input class="form-control"  name="freeIssue'+currentItem+'" id="freeIssue'+currentItem+'" type="text" /></td> <td align="center"><button  class="btn btn-danger" name="close" id="close" onclick="SomeDeleteRowFunction(this)"><i class="fa fa-close"></i></button></td></tr>';

  $('#data').append(strToAdd);


});

});

</script>

Answer 1

使用$（document）.on。（“ change”，“。productSelect”，函数（）{}）因为方法无法在准备就绪的文档上找到该类

jQuery不会将类识别为选择器

1 个答案: