<font color="#333333" size="4">简单灵活的权限树</font>

简单灵活的权限树

将 dree 作了一些修改： <o:p></o:p>

1、   增加 Node 的属性，目的是将原来的名称链接改成可选择的 checkbox <o:p></o:p>

 

function Node(id, pid, cname, cvalue, cshow, cchecked, cdisabled, url, title, target, icon, iconOpen, open) {<o:p></o:p>

    this.id = id;<o:p></o:p>

    this.pid = pid;<o:p></o:p>

    //chechbox的名称<o:p></o:p>

    this.cname = cname;<o:p></o:p>

    //chechbox的值<o:p></o:p>

    this.cvalue = cvalue;<o:p></o:p>

    //chechbox的显示<o:p></o:p>

    this.cshow = cshow;<o:p></o:p>

    //chechbox是否被选中，默认是不选<o:p></o:p>

    this.cchecked = cchecked||false;<o:p></o:p>

    //chechbox是否可用，默认是可用<o:p></o:p>

    this.cdisabled = cdisabled||false;<o:p></o:p>

    //节点链接，默认是虚链接<o:p></o:p>

    this.url = url||'#';<o:p></o:p>

    this.title = title;<o:p></o:p>

    this.target = target;<o:p></o:p>

    this.icon = icon;<o:p></o:p>

    this.iconOpen = iconOpen;<o:p></o:p>

    this._io = open || false;<o:p></o:p>

    this._is = false;<o:p></o:p>

    this._ls = false;<o:p></o:p>

    this._hc = false;<o:p></o:p>

    this._ai = 0;<o:p></o:p>

    this._p;<o:p></o:p>

};<o:p></o:p>

2、   将原来节点显示改为 checkbox ，根节点不变，考虑了是否已选和是否可用的状态 <o:p></o:p>

 

if(node.pid == this.root.id){<o:p></o:p>

        str += node.cname;<o:p></o:p>

    }else{<o:p></o:p>

        /**组装checkbox开始*/<o:p></o:p>

        checkboxSyntax = "<input type='checkbox' desc='" + node.cshow + "' name='" + node.cname + "' id='" + node.cname + "_" + node.id + "' value='" + node.cvalue + "' onClick='javascript: " + this.obj + ".checkNode(" + node.id+","+node.pid+","+node._hc + ",this.checked);' ";<o:p></o:p>

        //是否被选中<o:p></o:p>

        if(node.cchecked)<o:p></o:p>

            checkboxSyntax += " checked ";<o:p></o:p>

        //是否可用<o:p></o:p>

        if(node.cdisabled)<o:p></o:p>

            checkboxSyntax += " disabled ";         <o:p></o:p>

        checkboxSyntax += ">" + node.cshow;<o:p></o:p>

        /**组装checkbox结束*/<o:p></o:p>

                <o:p></o:p>

        str += checkboxSyntax;<o:p></o:p>

    }<o:p></o:p>

3、   增加一些选中的方法 <o:p></o:p>

功能是： <o:p></o:p>

l          选中叶节点时递归选中父节点； <o:p></o:p>

l          选中有子孙的节点时子孙节点递归选中； <o:p></o:p>

l          去掉节点选择时如果兄弟节点没有选中的也去掉直接父节点的选中； <o:p></o:p>

 

//=============================== <o:p></o:p>

// 作用：选中节点对象 <o:p></o:p>

// 参数： nobj node 对象 <o:p></o:p>

//      cobj checkbox 对象 <o:p></o:p>

//=============================== <o:p></o:p>

dTree.prototype.checkNode = function(id,pid,_hc,checked) { <o:p></o:p>

    //1 、递归选父节点对象（无论是叶节点还是中间节点） <o:p></o:p>

    // 判断同级中有无被选中的，如果有选中的就不可以反选 <o:p></o:p>

    if(!this.isHaveBNode(id,pid)){ <o:p></o:p>

        if(checked){ <o:p></o:p>

            // 选中就一直选到根节点 <o:p></o:p>

            this.checkPNodeRecursion(pid,checked); <o:p></o:p>

        }else{ <o:p></o:p>

            // 去掉选中仅将其父节点去掉选中 <o:p></o:p>

            this.checkPNode(pid,checked); <o:p></o:p>

        } <o:p></o:p>

    }   <o:p></o:p>

    <o:p></o:p>

    //2 、如果是中间结点，具有儿子，递归选子节点对象       <o:p></o:p>

    if(_hc)     <o:p></o:p>

        this.checkSNodeRecursion(id,checked); <o:p></o:p>

    <o:p></o:p>

} <o:p></o:p>

<o:p> </o:p>

//=============================== <o:p></o:p>

// 作用：判断同级中有无被选中的 <o:p></o:p>

// 参数： id 节点 id <o:p></o:p>

//      pid 节点的父节点 id <o:p></o:p>

//=============================== <o:p></o:p>

dTree.prototype.isHaveBNode = function(id,pid) {    <o:p></o:p>

    var isChecked = false <o:p></o:p>

    for (var n=0; n<this.aNodes.length; n++) { <o:p></o:p>

        // 不是节点自身、具有同父节点兄弟节点 <o:p></o:p>

        if (this.aNodes[n].pid!=-1&&this.aNodes[n].id!=id&&this.aNodes[n].pid == pid) {          <o:p></o:p>

            if(eval("document.all."+ this.aNodes[n].cname + "_" + this.aNodes[n].id + ".checked")) <o:p></o:p>

                isChecked = true;           <o:p></o:p>

        } <o:p></o:p>

    } <o:p></o:p>

    <o:p></o:p>

    return isChecked; <o:p></o:p>

}; <o:p></o:p>

<o:p> </o:p>

//=============================== <o:p></o:p>

// 作用：递归选中父节点对象 <o:p></o:p>

// 参数： pid 节点的父节点 id <o:p></o:p>

//      ischecked 是否被选中 <o:p></o:p>

//=============================== <o:p></o:p>

dTree.prototype.checkPNodeRecursion = function(pid,ischecked) { <o:p></o:p>

    for (var n=0; n<this.aNodes.length; n++) { <o:p></o:p>

        if (this.aNodes[n].pid!=-1&&this.aNodes[n].id == pid) {         <o:p></o:p>

            eval("document.all."+ this.aNodes[n].cname + "_" + this.aNodes[n].id + ".checked = " + ischecked); <o:p></o:p>

            this.checkPNodeRecursion(this.aNodes[n].pid,ischecked); <o:p></o:p>

            break; <o:p></o:p>

        } <o:p></o:p>

    } <o:p></o:p>

}; <o:p></o:p>

<o:p> </o:p>

//=============================== <o:p></o:p>

// 作用：递归选中子节点对象 <o:p></o:p>

// 参数： id 节点 id <o:p></o:p>

//      ischecked 是否被选中 <o:p></o:p>

//=============================== <o:p></o:p>

dTree.prototype.checkSNodeRecursion = function(id,ischecked) {  <o:p></o:p>

    for (var n=0; n<this.aNodes.length; n++) { <o:p></o:p>

        if (this.aNodes[n].pid!=-1&&this.aNodes[n].pid == id) {         <o:p></o:p>

            eval("document.all."+ this.aNodes[n].cname + "_" + this.aNodes[n].id + ".checked = " + ischecked); <o:p></o:p>

            this.checkSNodeRecursion(this.aNodes[n].id,ischecked);          <o:p></o:p>

        } <o:p></o:p>

    } <o:p></o:p>

}; <o:p></o:p>

分享到：

一些Liferay小问题的分析 | 在jsp环境中配置使用FCKEditor

• 2007-03-30 14:18
• 浏览 1107
• 评论(0)
• 查看更多