jQuery的each()方法不能遍历所有元素

Question

我已经盯着这个明显不起作用的小代码片段看了很久。为什么选择框(rel属性)没有弹出警报？

HTML：

<select rel="prop216" name="prop[]">
  <option value="">- none</option>
  <option value="12">Opt 1</option>
  <option value="13">Opt 2</option>
</select>
<select rel="prop217" name="prop[]">
  <option value="">- none</option>
  <option value="12">Opt 1</option>
  <option value="13">Opt 2</option>
</select>

jQuery:

$("select").change(function()
{
 var i = 0;
 var alteredSelects = [];
 $("select").each(function()
 {
    if ( $(this).val() !== "" )
    {
        alteredSelects[i][0] = $(this).attr('rel');
        alteredSelects[i][1] = $(this).val();
        alert ($(this).attr('rel'));
        i++;

    }
 });
});

请参阅我的 jSfiddle：http://jsfiddle.net/ft6Bd/1/

我在 Firefox 中遇到了错误

TypeError: 无法将 undefined 转换为对象

在这行代码上：alteredSelects[i][0] = $(this).attr('rel');

但是似乎不知道为什么会出现这种情况。

- jtheman

Answer 1

在为alteredSelects[i]分配值之前，您必须先初始化它：

$("select").change(function() {
    var i = 0;
    var alteredSelects = [];
    $("select").each(function() {
        if ( $(this).val() !== "" ) {
            alteredSelects[i] = []; // <-- Initialize `alteredSelects[i]` as empty array.
            alteredSelects[i][0] = $(this).attr('rel');
            alteredSelects[i][1] = $(this).val();
            alert($(this).attr('rel'));
            i++;
        }
    });
});

问题在于你试图保存一些内容到 alteredSelects[i]，而此时 alteredSelects[i] 却是 null。

- Cerbrus

---

能否告诉我给我点踩的人为什么这样做？如果我犯了错，我想从中学习。 - Cerbrus

Answer 2

这不是答案，但你不应该使用自己声明的变量进行索引： jQuery each已经有了自己的索引：

  $.each(collection, function(index, value) { 

  });

- speti43

---

我也考虑过这个问题，但在他的情况下，他需要一个自定义计数器，因为并不是所有的选择都等于“”。所以他最终会在数组中有空值。 - VVV

但是这会给我所有选择元素的索引，我只需要那些被设置的。 - jtheman

在这种情况下可能不正确，但这是一个好的建议。 - Cerbrus

好的，你是对的。我没有看到，只有在条件为真时才会增加。抱歉 :) - speti43