首页 > 编程学习 > buffalo+list+ul+li 实现Ajax多级菜单
20107 月27

buffalo+list+ul+li 实现Ajax多级菜单

Buffalo ajax使用说明

源代码




LeftMenu



    var endPointTop = '/${globals_sys_basename}/buffalo';//globals_sys_basename应用根目录
    var waitingImg = '/${globals_sys_basename}/images/oa/loading.gif';
    var loadingImg = '/${globals_sys_basename}/images/oa/loading.gif';
    var userId = '$!{user.getLoginname()}';
    var deptId = '$!{user.getUnitid()}';
    var alreadyOpenTableId = null;
    var hrefBaseValue = null;
     //HTTP://WWW.WIZZER.CN
     function getUl(e) {
        for (var i = 0; i 0) {
                    var ulElem = document.createElement("ul");

                    var temp = "";
                    ulElem.className = "MenuLevel2";
                    ulElem.ID = "MENU_" + menuId + "S";
                    ulElem.style.display = "";
                    for (var i = 0; i < str.length; i++) {
                        temp += "";
                    }
                    ulElem.innerHTML = temp;
                    e.appendChild(ulElem);
                }
            });
        } catch (ex) {
        }

    }

    function closeMenu() {
        if (alreadyOpenTableId == null) return;
        alreadyOpenTable = document.all(alreadyOpenTableId);
        if (alreadyOpenTable.childNodes.length > 1){
            targetTable = alreadyOpenTable.childNodes[1];
        }else{return;}
        targetTable.style.display = "none";
        alreadyOpenTableId = null;
    }
    function menuClick(e) {
        var currentTableSrc = e;
        if (currentTableSrc.id != alreadyOpenTableId && currentTableSrc.id!=alreadyOpenTableId+"0001") closeMenu();

        targetTableId = currentTableSrc.id + "S";
        if (e.childNodes.length > 1){
            targetTable = e.childNodes[1];
        }else{targetTable=null;}
        if (targetTable == null)return;
        if (targetTable.style.display == "none") {
            targetTable.style.display = '';
            alreadyOpenTableId = currentTableSrc.id;
        } else {
            targetTable.style.display = "none";
        }
    }
 

    


menu.css样式表 

body {
    background: #d8edfc;
    font-size: 12px;
    font-family: 宋体;
    scrollbar-base-color: #dbecf8;
    scrollbar-arrow-color: #2a8ed1;
    scrollbar-track-color: #bdddf2;
    scrollbar-3dlight-color: #2886c5;
    scrollbar-darkshadow-color: #2886c5;
    scrollbar-face-color: #dbecf8;
    scrollbar-shadow-color: #dbecf8;
    margin: 1px;
    border: 3px solid #4891c6;
}

#MenuUl {
    list-style:none;
    margin: 0px;
    padding: 0px;
    background: #d8ebf7;
}

ul.MenuLevel2 {
    list-style:none;
    margin: 0px;
    padding: 0px;
    background: #d8ebf7;
}

.level1 {
    font-weight: bold;
    color: #005790;
    padding-bottom: 1px;

}

.level2 {
    font-weight: normal;
    color: #005790;
}

.level3Head {
    font-weight: normal;
    color: #2479b6;
    width: 100%;
    height: 21px;
    padding-left: 61px;
    padding-top: 4px;
    background: url(images/menu_bg_head.gif) no-repeat;
    cursor: hand;
}

.level33 {
    font-weight: normal;
    color: #2479b6;
    width: 100%;
    height: 21px;
    padding-left: 61px;
    padding-top: 4px;
    background: url(images/menu_bg_3.gif) no-repeat;
    cursor: hand;
}

.level32 {
    font-weight: normal;
    color: #2479b6;
    width: 100%;
    height: 21px;
    padding-left: 61px;
    padding-top: 4px;
    background: url(images/menu_bg_2.gif) no-repeat;
    cursor: hand;
}

.level1Style {
    /*font-size:18px;  */
    width: 155px;
    height: 24px;
    background: url(images/menu_btn_bg.gif) no-repeat;
    padding-left: 20px;
    padding-top: 4px;
    cursor: hand;
}

.level1SelectedStyle {
    width: 155px;
    height: 24px;
    background: url(images/menu_btn_bg_selected.gif) no-repeat;
    padding-left: 20px;
    padding-top: 4px;
    cursor: hand;
}

.level2Style {
    width: 100%;
    height: 20px;
    background: #8ec4e9;
    padding-left: 30px;
    padding-top: 4px;
    border-top: 1px solid #eff6fb;
    cursor: hand;
}

本文地址:https://wizzer.cn/archives/571 , 转载请保留.

本文目前尚无任何评论.

发表评论