扩展和折叠文件夹

时间:2012-09-12 10:23:10

标签: javascript toggle

我需要多个元素来切换打开和关闭。现在该功能只是选择ID,但我想知道如何选择一个类。我以为我可以将document.getElementById更改为document.getElementByClass,但这不起作用。

我在搜索过程中选择了这段代码:

#ToggleTarget {display:hidden;}

<script type="text/javascript">
function Toggle() {
    var el = document.getElementById("ToggleTarget");
    if (el.style.display == "block") {
        el.style.display = "none";
    }
    else {
        el.style.display = "block";
    }
}
</script>

1 个答案:

答案 0 :(得分:1)

var getElementsByClassName = function(node, classname) {
    if (document.getElementsByClassName) { 
        return document.getElementsByClassName(classname);
    }
    var a = [];
    var re = new RegExp('(^| )'+classname+'( |$)');
    var els = node.getElementsByTagName("*");
    for(var i=0,j=els.length; i<j; i++)
        if(re.test(els[i].className))a.push(els[i]);
    return a;
}

var Toggle = function(){
    var tp = getElementsByClassName(document.documentElement,'toggle');
        for(var i = 0; i < tp.length; i++){
            if(tp[i].style.display=='none')
                tp[i].style.display='block'
            else
                tp[i].style.display='none'
    }
}

使用getElementsByClassName然后循环播放它们。

修改

请确保他们拥有我上面代码中使用的课程toggle

<强>更新

为IE支持添加了功能(从https://stackoverflow.com/a/7410966/600101采用)。