依赖javascript的下拉列表在IE 8中不起作用

我在这里搜索了一个javascript下拉列表，它根据另一个下拉列表和我在Chrome中使用的代码进行更改。但是，它在IE8.0.6中不起作用，我想知道是否有人可以突出显示不起作用的部分，或者建议另一种解决方法JQuery、CSS等

当我将其加载到IE中时，第二个下拉列表完全为空。第一个下拉列表是数组的变体，当用户选择其中一个数组时，它们将显示在数组中的选项。因此，如果我选择iAffordability，我将在数组中显示三个值

这是我正在使用的代码

iAffordability = new Array("Unable to Get Mortgage", "Cant Afford to Move", "Price");
iDisintruction = new Array("Branch Disinstructed");
iCourtOrder = new Array("Court Order");
iLackofComms = new Array("Marketing", "Viewings", "Offers");
iLackofOffers = new Array("Not Happy with Amount", "Not Happy with Quality");

populateSelect();

$(function () {

    $('#WD').click(function () {
        populateSelect();
    });

});


function populateSelect() {
    WD = $('#WD').val();
    $('#Sub').html();


    if (WD == 'iAffordability') {
        $('#Sub').empty();
        iAffordability.forEach(function (t) {

            $('#Sub').append('<option>' + t + '</option>');
        });
    }

    if (WD == 'iDisintruction') {
        $('#Sub').empty();
        iDisintruction.forEach(function (t) {
            $('#Sub').append('<option>' + t + '</option>');
        });
    }

    if (WD == 'iLackofComms') {
        $('#Sub').empty();
        iLackofComms.forEach(function (t) {
            $('#Sub').append('<option>' + t + '</option>');
        });
    }

    if (WD == 'iLackofOffers') {
        $('#Sub').empty();
        iLackofOffers.forEach(function (t) {
            $('#Sub').append('<option>' + t + '</option>');
        });
    }

}

---

对于我现有的JS。

我将建议对代码进行重构和干燥：

var lists = {
    iAffordability: ["Unable to Get Mortgage", "Cant Afford to Move", "Price"],
    iDisintruction: ["Branch Disinstructed"],
    iCourtOrder: ["Court Order"],
    iLackofComms: ["Marketing", "Viewings", "Offers"],
    iLackofOffers: ["Not Happy with Amount", "Not Happy with Quality"]
};

$(function () {
    populateSelect();
    $('#WD').change(function () {
        populateSelect();
    });
});

function populateSelect() {
    var WD = $('#WD').val(), $sub = $('#Sub');
    $sub.empty();
    $.each(lists[WD] || ["Error"], function(_, t) {
        $sub.append('<option>' + t + '</option>');
    });
}

---

即使在旧版本的IE中也应该可以这样做，因为它使用jQuery$。each函数而不是Array.prototype.forEach-正如RobG所指出的，这个函数只在IE9 ah中添加，如果IE强迫自己像Chrome那样更新的话。。。将来扩展起来应该容易得多。

如果你能创建一个JSFIDLE代码就好了。哪个IE？请注意，IE 8及更低版本不支持Array.prototype.forEach。您知道.val的值是select的值吗？因为我的值是我想要上传到SQL的值，但是html版本不同，并且有空格，因为它面向用户。Thanks@Greylegface面向用户的值可能会对您有所帮助。我添加了一个JSFIDLE，请您看一下好吗？谢谢。是的，正如您所说，我在选项中有值，但我想知道javascript中的.val会看哪一个。例如，其中一个是value属性是value。要获得面向用户的值，需要文本。

var lists = {
    iAffordability: ["Unable to Get Mortgage", "Cant Afford to Move", "Price"],
    iDisintruction: ["Branch Disinstructed"],
    iCourtOrder: ["Court Order"],
    iLackofComms: ["Marketing", "Viewings", "Offers"],
    iLackofOffers: ["Not Happy with Amount", "Not Happy with Quality"]
};

$(function () {
    populateSelect();
    $('#WD').change(function () {
        populateSelect();
    });
});

function populateSelect() {
    var WD = $('#WD').val(), $sub = $('#Sub');
    $sub.empty();
    $.each(lists[WD] || ["Error"], function(_, t) {
        $sub.append('<option>' + t + '</option>');
    });
}