使用jQuery检查动态命名的选择

Question

如何使用jquery获取动态命名的select的值？

我有填充这样选择的几个（没有确切的数目）：

<?php 
    for ($i = 0; $i < count($manifest); $i++) 
     echo '<select id="headerColumn_' . $i . '"> 
      <option value="">-- Column Header --</option> 
      <option value="1">Option 1</option> 
      <option value="2">Option 2</option> 
      <option value="3">Option 3</option> 
      <option value="4">Option 4</option> 
     </select>'; 
    ?> 

稍后，我有一个按钮，包括一个onclick到一个函数。当这个函数被调用时，我传递了多少选择被创建。现在，我需要获得所有选择的价值。我尝试这样做：

for (var i = 0; i < valuePassedIntoFunction; i++) 
{ 
    var thisValue = $("#headerColumn_" + i).val(); 
    alert("#headerColumn_" + i + " = " + thisValue); 
} 

但是当我运行的页面，我只是一个弹出这个：

#headerColumn_1 = undefined 

我怎样才能jQuery来接受我的动态命名约定？

Answer 1

使用$.map函数来遍历与开始headerColumn_的ID的所有元素，并返回每个元素值到一个数组：

var arr = $.map($('[id^="headerColumn_"]'), function(el, i) {return el.value; }); 

或以警告所有ID的和值：

$('[id^="headerColumn_"]').each(function(i, el) { 
    alert(el.id + ' = ' + el.value); 
});