`
leyoo
  • 浏览: 43660 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类

js 实现菜单树

阅读更多
// 帮助菜单栏目
var menuList =
[
   {
     'FMENU_NAME':'注册与登录',
     'CHILDS':[
   {'CMENU_NAME':'如何注册','LINK_URL':'http://www.3yx.com/memberAction.do?method=add'},
       {'CMENU_NAME':'安全模式登录','LINK_URL':'help_aqmsLogin.html'},
       {'CMENU_NAME':'密码错误如何处理','LINK_URL':'http://www.3yx.com/forward.do?method=menuForward&forward=getpasswordback'}
       ]
   },
   {
     'FMENU_NAME':'如何充值',
     'CHILDS':[
   {'CMENU_NAME':'如何充值','LINK_URL':'http://www.3yx.com/gameCardSocketAction.do?method=getCarCZPage'},
       {'CMENU_NAME':'如何购卡','LINK_URL':'#'},
       {'CMENU_NAME':'如何开通网银','LINK_URL':'help_internetBank.html'}
       ]
   },
   {
     'FMENU_NAME':'买家帮助',
     'CHILDS':[
       {'CMENU_NAME':'搜索商品','LINK_URL':'help_serachGoods.html'},
       {'CMENU_NAME':'支付密码错误处理','LINK_URL':'http://www.3yx.com/forward.do?method=menuForward&forward=hyzx_zfpassword'},
       ]
   },
   {
     'FMENU_NAME':'卖家帮助',
     'CHILDS':[
       {'CMENU_NAME':'发布货物','LINK_URL':'help_fbwb.html'},
       {'CMENU_NAME':'管理货物','LINK_URL':'help_glwb.html'},
       {'CMENU_NAME':'商家诚信认证体系','LINK_URL':'#'},
       ]
   },
   {
     'FMENU_NAME':'财务中心',
     'CHILDS':[
       {'CMENU_NAME':'账户锁定','LINK_URL':'help_sdzh.html'},
       {'CMENU_NAME':'实名认证','LINK_URL':'help_smrz.html'}
       ]
   },
    {
     'FMENU_NAME':'个人信息',
     'CHILDS':[
       {'CMENU_NAME':'密保卡','LINK_URL':'help_mbk.html'}
       ]
   },
{
     'FMENU_NAME':'全自动交易',
     'CHILDS':[
       {'CMENU_NAME':'交易介绍','LINK_URL':'help_gfjyjs.html'},
       {'CMENU_NAME':'如何购买','LINK_URL':'help_gfwhatbuy.html'},
       {'CMENU_NAME':'如何出售','LINK_URL':'help_gfwhatsell.html'},
       {'CMENU_NAME':'全自动交易常见问题','LINK_URL':'help_gfQuestions.html'}
       ]
   },
   {
     'FMENU_NAME':'交易规则',
     'CHILDS':[
       {'CMENU_NAME':'正常流程','LINK_URL':'help_zclc.html'},
       {'CMENU_NAME':'退款处理','LINK_URL':'help_tkcl.html'},
       {'CMENU_NAME':'买家权益保障','LINK_URL':'#'}
      ]
   },
{
     'FMENU_NAME':'游戏携带与交易表',
     'CHILDS':[
       {'CMENU_NAME':'地下城与勇士','LINK_URL':'dnf.html'}
            ]
   },
   {
     'FMENU_NAME':'收费标准',
     'CHILDS':[
       {'CMENU_NAME':'普通交易','LINK_URL':'help_ptjy.html'},
       {'CMENU_NAME':'全自动交易','LINK_URL':'help_gfjy.html'}
       ]
   },
  {
     'FMENU_NAME':'推广加盟',
     'CHILDS':[
       {'CMENU_NAME':'收货联盟','LINK_URL':'help_shlm.html'},
       {'CMENU_NAME':'推广员系统','LINK_URL':'help_tgy.html'},
       {'CMENU_NAME':'推广员系统常见问题','LINK_URL':'help_tgQuestions.html'}
       ]
   },
   {
     'FMENU_NAME':'如何获得软件支持',
     'CHILDS':[
       {'CMENU_NAME':'利润统计软件','LINK_URL':'help_lr.html'},
       {'CMENU_NAME':'库存管理系统','LINK_URL':'http://www.3yx.com/forward.do?method=menuForward&forward=product'}
       ]
   },
{
     'FMENU_NAME':'抵用券使用说明',
     'CHILDS':[
       {'CMENU_NAME':'抵用券使用说明','LINK_URL':'help_dyq.html'}
            ]
   },
{
     'FMENU_NAME':'超时赔付',
     'CHILDS':[
       {'CMENU_NAME':'超时赔付使用说明','LINK_URL':'help_pf.html'}
            ]
   },
];

function $(id)
{
  return document.getElementById(id);
}

//查找栏目所在位置
function findMenuIndex(childName)
{
  var result = new Object();
  result.parentIndex = -1;
  result.selfIndex = -1;
  result.link = '';
   for(var key in menuList)
   {
  fatherItem = menuList[key];
  childMenus = fatherItem.CHILDS;
      for(var childKey in childMenus)
      {
childItem = childMenus[childKey];
if(childItem.CMENU_NAME == childName)
{
   result.parentIndex =  key;
   result.selfIndex =  childKey;
   result.link = childItem.LINK_URL;
   break;
}
  }
   }
   return result;
};

//展开指定栏目
function expendChild(childName)
{
   if(childName != null && typeof(childName) != "undefined")
   {
      var result = findMenuIndex(childName);
      if(result != null && result.parentIndex > -1 && result.selfIndex > -1)
  {
        //展开当前栏目
    expendMenu(result.parentIndex);
var aObj = $("A_"+result.parentIndex+"_"+result.selfIndex);
if(aObj != null && typeof(aObj) != "undefined")
{
  aObj.style.color = "red";
}
  }
   }
};

//帮助菜单栏展开
function expendMenu(key)
{
    var ImgFObj = $("IMG_F_"+key);
  var childMenus = $("MENU_"+key);
  if(childMenus == null)
    return false;
  //ImgFObj.show = ImgFObj.show == "block" ?  "none" : "block" ;
  //ImgFObj.src =  (ImgFObj.show == "block" ?  "images/iecool_arrow_182.gif" : "images/iecool_arrow_182.gif") ;
  //if(childMenus && childMenus.length)
  //{
    // for(var i = 0; i < childMenus.length; i++)
  //  {
  //      childMenus[i].style.display = ImgFObj.show;
  //   }
  //}
//else
    if(childMenus)
  {
  ImgFObj.className=ImgFObj.className=="menu-close"?"menu-open":"menu-close";
    childMenus.style.display = childMenus.style.display=="block"?"none":"block";
  }
};



//菜单连接页面
function linkUrl(url,key)
{
   if(url != "" && url != undefined){
     window.location= url ;
   }
};

function left()
{
    //start
    var htmlTxt = "<div class=\"shuoming\">";
    htmlTxt +="<ul class=\"zhuce\">";

    for(var key in menuList)
    {
        fatherItem = menuList[key];
        childMenus = fatherItem.CHILDS;

        //菜单
        var txt="";
        if(key=="0")  txt=" denglu";
        var txt1="";
        txt1=" ruanjian";
        htmlTxt +="<li class=\"title"+txt+"\" > <span class=\"bold\"><span class=\"bold2"+txt1+"\" onclick = \"javascript:expendMenu("+key+");\">"+fatherItem.FMENU_NAME+"</span></span>";
        //子菜单
        htmlTxt +="<ul id=\"MENU_"+key+"\" class=\"hide\">";
        for(var childKey in childMenus)
        {
//判断是否要弹出新页面
if(childMenus[childKey].CMENU_NAME =="如何注册" || childMenus[childKey].CMENU_NAME =="密码错误如何处理" || childMenus[childKey].CMENU_NAME =="如何充值" || childMenus[childKey].CMENU_NAME =="支付密码错误处理"  || childMenus[childKey].CMENU_NAME =="库存管理系统"){
    htmlTxt +="<li class=\"list2\"><a id=\"A_"+key+"_"+childKey+"\" target=\"_blank\" class=\"sd\" href=\""+childMenus[childKey].LINK_URL+"\">"+childMenus[childKey].CMENU_NAME+"</a></li>";
} else{
                htmlTxt +="<li class=\"list2\"><a id=\"A_"+key+"_"+childKey+"\" target=\"_self\" class=\"sd\" href=\""+childMenus[childKey].LINK_URL+"\">"+childMenus[childKey].CMENU_NAME+"</a></li>";
            }
//htmlTxt +="<li class=\"list2\"><a id=\"A_"+key+"_"+childKey+"\" class=\"sd\" href=\""+childMenus[childKey].LINK_URL+"\">"+childMenus[childKey].CMENU_NAME+"</a></li>";
            //htmlTxt +="<li class=\"list2\"><a id=\"A_"+key+"_"+childKey+"\" class=\"sd\" href=\"#\" onclick=\"javascript:linkUrl('"+childMenus[childKey].LINK_URL+"','"+key+"');\">"+childMenus[childKey].CMENU_NAME+"</a></li>";
        }
        htmlTxt +="</ul>";
        htmlTxt +="</li>";
    }

    //end
    htmlTxt +="    </ul>";
    htmlTxt +="  </div>";
    document.writeln(htmlTxt);
};

function left2()//zhangh 2010-10-23
{
    document.writeln(getMenuHtml());
};
//菜单栏HTML
function getMenuHtml()//zhangh 2010-10-23
{
   var menuHtml = '<div class="member-bd"\n>';
   var fatherItem = null;
   var childItem = null;
   var childMenus = null;
   var menuLen = menuList.length;
   for(var key in menuList)
   {
    //用户菜单栏
    fatherItem = menuList[key];
    if(fatherItem != null && fatherItem.FMENU_NAME != undefined){
    menuHtml += '<div class="menu-box" id="buyer">\n';
    menuHtml += "<H3 class=\"member-bar\"><span onclick = \"javascript:expendMenu("+key+");\">"+fatherItem.FMENU_NAME+"</span>\n";
    menuHtml += "<button class=\"menu-open\" id=\"IMG_F_"+key+"\" onclick = \"javascript:expendMenu("+key+");\">-</button> \n";
    menuHtml += '</H3>\n';
    menuHtml += "<ul class=\"group\" id=\"MENU_"+key+"\" class=\"hide\" style=\"display:none;\">\n";
    childMenus = fatherItem.CHILDS;
    //用户二级栏目
      for(var childKey in childMenus)
      {
childItem = childMenus[childKey];
if(childItem != null && childItem.CMENU_NAME != undefined){
//判断是否要弹出新页面
if(childItem.CMENU_NAME =="如何注册" || childItem.CMENU_NAME =="密码错误如何处理" || childItem.CMENU_NAME =="如何充值" || childItem.CMENU_NAME =="支付密码错误处理"  || childItem.CMENU_NAME =="库存管理系统"){
    //htmlTxt +="<li class=\"list2\"><a id=\"A_"+key+"_"+childKey+"\" target=\"_blank\" class=\"sd\" href=\""+childMenus[childKey].LINK_URL+"\">"+childMenus[childKey].CMENU_NAME+"</a></li>";
    menuHtml += "<li><span><a id=\"A_"+key+"_"+childKey+"\" href="+childItem.LINK_URL+" target=\"_blank\">"+childItem.CMENU_NAME+"</a></span></li>\n";
} else{
                //htmlTxt +="<li class=\"list2\"><a id=\"A_"+key+"_"+childKey+"\" target=\"_self\" class=\"sd\" href=\""+childMenus[childKey].LINK_URL+"\">"+childMenus[childKey].CMENU_NAME+"</a></li>";
            menuHtml += "<li><span><a id=\"A_"+key+"_"+childKey+"\" href="+childItem.LINK_URL+" target=\"_self\">"+childItem.CMENU_NAME+"</a></span></li>\n";
            }
  //此栏目是否可访问
         //if(!viewMenu(childItem.CMENU_NAME)) continue;
         //menuHtml += "<tr id=\"TR_MENU_"+key+"\" style=\"display:none;\" >";
         //menuHtml += "<td style=\""+( key == menuLen - 1 &&  childKey == childMenus.length-1 ? "border-bottom:1px solid #ececec;" : "" )+"\" width=\"206\" height=\"25\" align=\"left\" background=\"images/Menu/titbg2.png\" onMouseMove=\"this.className='sidebar_bg_ys'\" onMouseOut=\"this.className='#'\">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img src=\"images/Menu/dot_m.gif\" width=\"3\" height=\"5\" />&nbsp;<a href=\"#\" onclick=\"javascript:MyLinkUrl({LINK_URL:'"+childItem.LINK_URL+"','TARGET':'"+childItem.TARGET+"'},'"+key+"');\"  class=\"febt\">"+childItem.CMENU_NAME+"</a></td>";
         //menuHtml += "</tr>";
         }
  }
   menuHtml +='</ul>\n';
   menuHtml +='</div>\n';
}
   }
   menuHtml +='</div>\n';
   //document.write('<SCRIPT type="text/javascript" src="hy/js/common_v2.js"></SCRIPT>');
   return menuHtml;   
  
}
function bottom()
{
};
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics