Question

我在这里搜索了一个javascript下拉列表，根据另一个下拉列表以及我在Chrome中运行的代码进行了更改。但是，它在IE 8.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 Fiddle

更新：

代码有效，我只需添加：

if (!window.console) console = {log: function() {}};

到我现有的JS。

Answer 1

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

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中添加（啊，如果只是IE强制它本身就像Chrome一样更新......）并且将来应该更容易扩展。

javascript依赖下拉不在IE 8中工作

1 个答案: