Question

我希望如此：

$('.iat_map').each(function(i,el) {
    $(el).html(opt_list);
});

而且：

$('.iat_map').html(opt_list);

做同样的事情。但是，当我尝试前者时，它会清除内容而不是用opt_list替换它。（.iat_map指的是一堆<selects>）。

如果我在console.log(opt_list)内each()，则会按预期输出。

是什么给出的？

Made a fiddle。完全可重复（至少在Chrome 21中）。

Answer 1

无法分辨出发生了什么，尝试了一些我认为可能造成麻烦的事情，到目前为止找不到解决办法，但这就是我要做的事情并且有效。

var options = [
    [1, "one"],
    [2, "two"],
    [3, "three"]
];

var list = [];
for (var i in options) {
    list.push(
        '<option value="'+ options[i][0] +'">'+
            options[i][1] +            
        '</option>'        
    );
}

$('.sel').empty().append(
    '<option>&ndash; Not selected &ndash;</option>'+
    list.join('')
);

演示： http://jsfiddle.net/elclanrs/U9agP/4/

Answer 2

问题是opt_list是一个jQuery对象（意味着jQuery将选项放入DOM元素中），当你追加jQuery对象时，DOM元素将从旧位置移除并添加到新位置。

这就是为什么当你使用.each时，你会注意到这些选项只在最后一个选项上。

显然，当你执行$('.iat_map').html(opt_list);时，jQuery会在追加DOM元素之前克隆它们。

我建议将opt_list改为字符串，而不是jQuery对象。

Answer 3

需要克隆列表。 http://jsfiddle.net/mnbayazit/U9agP/5/

它正在将元素从一个<select>移动到下一个，因为它们是引用。

Answer 4

根据jQuery文档，对jQuery对象的每个调用与在泛型数组上使用的调用略有不同。

尝试丢失el，而只使用this。

$(this).html(opt_list);

http://api.jquery.com/each/

jQuery.each和.html的行为不符合预期

4 个答案: