Question

我认为IE讨厌我。我在其他浏览器中所做的一切都有效，但IE 11，不！它失败了。我猜它是我，而不是浏览器。

我的网页上有一个<select>列表，我试图动态绑定<option>。

到目前为止，它在Firefox和Chrome中运行良好，但在IE中却不行。 IE开发工具（F12）中没有错误，所以我不知道它为什么拒绝工作。

HTML

<select id="MyList">
</select>

的Javascript

$(function() {
    var myItems=[];
    myItems.push({"All":"Hello"});
    myItems.push({"One":"And More"});
    myItems.push({"Two":"Lots More"});   

    for (i = 0; i< myItems.length;i++)  {
        for (item in myItems[i]) {
            var x = myItems[i][item]; //for my testing
            var y = myItems[item];    //for my testing
            $("#MyList").append("<option>" + item + "</option>");
        }
    }
});

如果你试试FF或Chrome中的小提琴，那一切都很好。 select列表填充了All，One和Two。

如果没有给IE精灵的礼物甚至某种形式的牺牲，我需要做些什么才能让IE对我感到满意？

Answer 1

这很奇怪。当我在IE中运行那个小提琴我很方便（IE9）时，我得到一个“访问被拒绝”错误并且没有加载jQuery。如果我改变小提琴使用1.11.0而不是1.10.1，我没有得到该错误并且脚本运行。

代码存在一些问题，主要是未声明的变量（您的代码正在成为The Horror of Implicit Globals的牺牲品）;这是一个updated fiddle，其中包含：

变量声明
使用jQuery 1.11.0
使用“no wrap - body”选项而非“onload”，因为您正在使用ready事件

以下是代码：

$(function() {
    var myItems=[];
    myItems.push({"All":"Hello"});
    myItems.push({"One":"And More"});
    myItems.push({"Two":"Lots More"});

    var i, item;
    for (i = 0; i< myItems.length;i++)  {
        for (item in myItems[i]) {
            var x = myItems[i][item];
            var y = myItems[item];
            $("#MyList").append("<option>" + item + "</option>");
        }
    }
});

另外，为了与更广泛的浏览器兼容，您可能希望使用Option构造函数和add列表的options方法，而不是附加DOM元件;一些旧版浏览器更喜欢它。看起来像这样：Fiddle

// Before the loop...
var options = $("#MyList")[0].options;

// ...in the loop
options.add(new Option(item));

Answer 2

JSFIDDLE

var sel = $("#MyList");
sel.empty();                
for (var i = 0; i< myItems.length;i++)  {
    for (var item in myItems[i]) {
        var x = myItems[i][item];
        var y = item;
        console.log(x);
        console.log(y);            
        sel.append('<option value="' + x + '">' + y + '</option>');
    }
}

正如@ T.J.Crowder在IE 10中已经提到的那样，jquery1.10.1无法正常工作并将jquery版本更新到以后它开始工作;

Answer 3

试试这个

$(function() {
    var myItems=[];
    myItems.push({"All":"Hello"});
    myItems.push({"One":"And More"});
    myItems.push({"Two":"Lots More"});


    for (i = 0; i< myItems.length;i++)  {
        for (item in myItems[i]) {
            var x = myItems[i][item];
            $('#MyList')
             .append($("<option></option>")
             .attr("value",x)
             .text(item)); 
        }
    }
});

无法在IE中附加，适用于Firefox和Chrome

3 个答案: