js用于树型结构级联选择

2016-02-19 22:17 64 1 收藏

get新技能是需要付出行动的,即使看得再多也还是要动手试一试。今天图老师小编跟大家分享的是js用于树型结构级联选择,一起来学习了解下吧!

【 tulaoshi.com - Web开发 】

html

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

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

body
ul id="tree"
    liinput type=checkbox
        ul
            liinput type=checkbox
                ul
                    liinput type=checkbox/li
                    liinput type=checkbox/li
                /ul
            /li
        /ul
    /li
/ul
/body
script language="javascript"

var arr = tree.getElementsByTagName('input')
for(var i=0; iarr.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; iarr.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

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/webkaifa/)

来源:http://www.tulaoshi.com/n/20160219/1628099.html

延伸阅读
标签: Web开发
CSS通过与(X)HTML的文档结构相对应的选择器(selector)来达到控制页面表现的目的,而文档结构不仅仅在CSS的应用上非常重要,对于行为层(例如使用JavaScript控制元素的行为)同样也非常重要。 文档结构(X)HTML文档可以看作一个家族树,这个树有1个祖先根元素,然后各元素依次向下排列,例如有XHTML代码如下,其文档树如图4-1所示...
标签: Web开发
入住日期:  离店日期:
标签: 软件教程
HTML网页制作的朋友不会陌生,在网页制作的是时候我们可能会用到编号。但是编号往往不是一级,那么我们该如何实现级联编号呢?下面小编就为大家分享一下HTML级联编号如何实现 CSS counter-reset 属性 CSS counter-reset 属性用于设置某个选择器出现次数的计数器的值。 我们就可以使用以下有序列表进行测...
树型控件拖动的完美实现 作者:一块三毛钱 下载本文源代码 树型控件用来显示具有一定层次结构的数据项时方便、直观,被广泛地应用在各种软件中,如资源管理器中的磁盘目录就用的是树型 控件,我们在编程中也会经常用到,但 MFC 中提供的 CTreeCtrl 类并不直接支持拖动节点等高级特性...
标签: Web开发
动机: 最初想起做二叉树是因为需要做一个公司结构图。 以前的做法都是直接用图象软件画出来一个图片。很好看,但每次有变动后都需要重新画一个新的。 另一方面,网页上对线条的显示、布局相当局限。根据动态生成的数据进行排版、定位都相当困难, 而且在美观上也差强人意。 做了各种尝试以后,决定用XML+XSL作数据运算; 用VML来美化...

经验教程

649

收藏

79
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部