javascript - jQuery 获取所有动态生成的选择

Question

我正在使用 jQuery 获取数据并通过 ajax 发布它。

为了获取这些数据，我使用了选择元素，用户可以根据需要生成更多选择。

每当这些选择中的任何一个发生变化时，我都希望返回它们的所有值，以便以后可以使用它们。

但是，当我尝试获取所有选择的值时出现错误

$(document).ready(function() {
  $("#marketingProd").on("change", function() {
	$("#marketingProd select").each(function() {
		alert(($this).val());
	});
   });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="marketingProd">
  <select class="marketingProd" name="marketingProd[]" id="marketingprod1">
    <option value=""></option>
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
    <option value="4">Four</option>
    <option value="5">Five</option>
  </select>
  <div class="newProd" id="newProd2">
    <select class="marketingProd" name="marketingProd[]" id="marketingProd2">
      <option value=""></option>
      <option value="1">One</option>
      <option value="2">Two</option>
      <option value="3">Three</option>
      <option value="4">Four</option>
      <option value="5">Five</option>
    </select>
  </div>
  <div class="newProd" id="newProd3">
    <select class="marketingProd" name="marketingProd[]" id="marketingProd3">
      <option value=""></option>
      <option value="1">One</option>
      <option value="2">Two</option>
      <option value="3">Three</option>
      <option value="4">Four</option>
      <option value="5">Five</option>
    </select>
  </div>
</div>

除了第一个之外的所有选择都是动态生成的。

更新:使问题更加清晰

Answer 1

您似乎没有正确委派事件处理程序尝试:

$(document).ready(function() {
  $("#marketingProd").on("change", "select", function() { // delegated to the SELECT
    $("#marketingProd select").each(function() {
        alert($(this).val()); // Fixed syntax error here
    });
   });
});

试试 fiddle :https://jsfiddle.net/qm2uyt6y/