Question

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

要获取此数据，我使用的是选择元素，用户可以根据需要生成更多选择。

每当选择任何更改时，我希望返回所有值，以便稍后使用。

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

＆＃13;

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

＆＃13;

<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>

＆＃13;

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

更新：为问题添加了更多清晰度

Answer 1

要获取所有动态添加的字段，只需使用jQuery的on()，如下所示：

protected override CreateParams CreateParams
{
        get
        {
            CreateParams cp = base.CreateParams;
            cp.ExStyle |= 0x02000000;  // Turn on WS_EX_COMPOSITED
            return cp;
        }
 }

在选择之前使用jQuery的$("#marketingProd").on("change", '.marketingProd', function(e) { ... });语法：

alert($(this).val());

$(document).ready(function() {
  var arr = [];
  $("#marketingProd").on("change", '.marketingProd', function() {
	arr.push($(this).val());
    console.log('Value changed: ' + $(this).val());
   });
  
  $("#btn").on('click', function(e) {
    console.log(arr);
  });
  
});

希望这有帮助！

Answer 2

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

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

尝试小提琴：https://jsfiddle.net/qm2uyt6y/

Answer 3

您可以使用他们的名字获取选择，然后迭代它。

$('select[name^="marketingProd"]').each(function(index,element){
   var selectedValue = element.val();
});

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

3 个答案: