使用JavaScript在HTML中创建下拉复选框列表

Question

我需要创建一个像这里的下拉复选框列表。 那里的代码存在的问题是，它在IE9中无法正常工作。 我收到一条错误消息，指出以下代码中的getElementsByClassName不是属性：

var checkList = document.getElementById('list1');
var items = document.getElementById('items');
        checkList.getElementsByClassName('anchor')[0].onclick = function (evt) {
            if (items.classList.contains('visible')){
                items.classList.remove('visible');
                items.style.display = "none";
            }

            else{
                items.classList.add('visible');
                items.style.display = "block";
            }


        }

        items.onblur = function(evt) {
            items.classList.remove('visible');
        }

有人可以帮我解决如何创建下拉复选框列表吗？ 谢谢。

Answer 1

classList属性不适用于10以下的IE浏览器。如果要执行此操作，则必须改用className并检查该类的索引。 例如：

if (items.className.indexOf('visible') > -1){
            items.className -= 'visible';
            items.style.display = "none";
        }

如果您的商品具有可见的类，它将返回其索引，如果没有该类，则将返回-1。 我在你这里制造了一个小提琴来演示