JS技术

js用于树型结构级联选择

字号+ 作者: 来源:    2014-11-17 20:00 我要评论( )

js用于树型结构级联选择,阅读js用于树型结构级联选择,htmlheadmeta http-equiv=

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>及联选择-用于权限选择比较合适</title>
</head>

<body>
<ul id="tree">
    <li><input type=checkbox>
        <ul>
            <li><input type=checkbox>
                <ul>
                    <li><input type=checkbox></li>
                    <li><input type=checkbox></li>
                </ul>
            </li>
        </ul>
    </li>
</ul>
</body>
<script language="javascript">

var arr = tree.getElementsByTagName('input')
for(var i=0; i<arr.length; i++){
    var input = arr[i]
    if(input.type = 'checkbox'){
        input.onclick = ClickInput
    }
}

function ClickInput(){
    var li = this.parentElement;
    var arr = li.getElementsByTagName('input')
    for(var i=0; i<arr.length; i++){
        var input = arr[i]
        if(input.type == 'checkbox'){
            input.checked = this.checked
        }
    }
    var li = li.parentElement.parentElement
   
    while(li.tagName.toLowerCase() == 'li'){
        var input = li.childNodes[0]
        if(input.tagName.toLowerCase() == 'input'){
            input.checked = this.checked
        }
        li = li.parentElement.parentElement
    }
}

</script>
</html>

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • js事件与处理_Javascript教程

    js事件与处理_Javascript教程

    2015-10-10 15:06

  • js对象属性及方法_Javascript教程

    js对象属性及方法_Javascript教程

    2015-10-10 15:04

  • js语句及语法_Javascript教程

    js语句及语法_Javascript教程

    2015-10-10 15:02

  • js数据类型与变量_Javascript教程

    js数据类型与变量_Javascript教程

    2015-10-10 15:00

网友点评