<Select> 数组元素的更改事件将通过 jQuery 填充另一个 <Select> 元素

Question

我有 2 个数组元素。我试图将更改事件绑定到第一个元素，以便选择更改甚至会影响第二个元素。 示例：

<select name="item1[]" id="item1[]">
  <option value="0">...</option>
  <option value="1">...</option>
  <option value="3">...</option>
</select>

<select name="item2[]" id="item2[]">
  <option value="0">...</option>
  <option value="1">...</option>
  <option value="3">...</option>
</select>

<select name="item1[]" id="item1[]">
  <option value="0">...</option>
  <option value="1">...</option>
  <option value="3">...</option>
</select>

<select name="item2[]" id="item2[]">
  <option value="0">...</option>
  <option value="1">...</option>
  <option value="3">...</option>
</select>

因此，有更多行包含 item1 和 item2 数组元素等待 PHP 进程。

当 item1 选择发生变化时， item2 将被填充。但即使在 item1 更改事件中，我的以下 jquery 函数也不起作用。我不明白为什么绑定功能不起作用。我尝试使用警报但不起作用。

<script>
$('#item1[]').each(function(index){
  $(this).bind("change", function(){
    another function call to populate item2
    alert($(this).val()); // not working
  });
});
</script>

请帮忙。

问候。

Answer 1

同一个id在一个文档中不能存在多次，jquery一找到一个id就停止搜索domobjects。

另外，[] 在 id 中无效，请参阅 W3C

Answer 2

除了 cmets，您还需要转义那些方括号（或从 ID 属性中删除它们 - 它们只会使事情复杂化，@jensgram 指出invalid in HTML 4）：

$('#item1\\[\\]')

见http://api.jquery.com/category/selectors/

Answer 3

不知道为什么要进行如此复杂的调用，但应该这样做：

$('#item1\\[\\]').change(function(){
    alert($(this).val());
});

（前提是您只有一个具有该 ID 的元素）。

[] 是属性选择器的元字符：

如果您希望使用任何元字符 (#;&,.+*~':"!^$[]()=>|/@) 作为名称的文字部分，则必须使用两个反斜杠转义该字符：\\。例如，如果您有一个带有id="foo.bar" 的元素，则可以使用选择器$("#foo\\.bar")。

顺便说一句，如果您有 PHP 的方括号，则不需要在 ID 中使用它们。它们仅在 name 属性中有意义。