Question

加载首次页面时，下拉选项不可见。

详情 -

它如何运作---＆gt; 我创建了多个下拉列表。对于第一个下拉列表的选项更改，其余的下拉列表删除所选选项。并且在选项更改下拉列表的第二个下拉列表时，再次删除所选选项。同样的过程再次进行，直到最后一次下降。

期 - ＆GT; 这在谷歌crome工作正常，但在IE页面加载时没有任何选项在任何下拉列表中可见。只有在该选项的其余部分可见后才选择一个选项。这是问题所在。我想onload也可以看到下拉列表中的选项，但不知何故在IE中它不起作用

提前致谢：）

input[name=telephone] { ...

Answer 1

我首先尝试通过不使用ID来使代码更易于维护，但节点本身也是如此。这样，您就不必为每个选择重复代码块。但我会为它们分配ID以供以后处理。我不知道它做了什么，但如果你从左到右选择，它在IE中适用于我：

var selects = [],
    numOfSelects = 6,
    options = ["ONE", "TWO", "THREE", "FOUR", "FIVE"];
window.addEventListener('DOMContentLoaded', createList, false);

function createList() {
    var form = document.getElementById("mainForm");
    for(var i = 0; i < numOfSelects; i++){
        var select = document.createElement('select');
        select.id = "mySelect" + i;
        selects.push(select);
        selects[i].addEventListener('change', removeList, false);
        for (var j = 0, k = options.length; j < k; j++) {
            var el = document.createElement("option");
            el.textContent = el.value = options[j];
            selects[i].appendChild(el);
        }
        form.appendChild(select);
    }
}

function removeList(ev) {
    var el = ev.currentTarget,
        value = el.value;
    for(var i = 0, l = selects.length; i<l; i++){
        if(selects[i].isSameNode(el)){continue;}
        var options = selects[i].childNodes;
        for(var j = 0, k = options.length; j < k; j++){
            if(options[j].value == value){
                selects[i].remove(j);
                j--;k--;
            }
        }
    }
}

<form id="mainForm" action= "" method ="get">
    Criteria One:
</form>

在IE中看不到使用javascript数组创建的下拉列表选项

1 个答案: