/**
* 思路:
* 1.首先获取到:
* ul下的菜单集合(A)
* 当前地址栏菜单(B)
* 上一次点击的菜单地址(C)
* 2.然后判断循环判断A里面的地址是不是“#”,#表示有子菜单;
* 如果有子菜单,则获取子菜单集合(D),然后当前地址和子菜单集合对比,相同的话给A加上样式,否则判断上一次点击的地址C和D对比
* 3.此次判断当前地址和A对比,如果匹配不到,则最后一次的时候,以上一次的菜单C和A“循环”对比
*/
window.onload = function() {
/** ul下的菜单集合(A) */
var liStr = $(".main-sidebar .sidebar .sidebar-menu").children();
/**当前地址栏菜单(B)*/
var browserUrl = location.href;
/** 封装地址 */
/** 封装前:http://localhost:8080/es/order/orderInfoQuery.htm */
var spritIndex1 = browserUrl.replace('/', 'a').replace('/', 'a').indexOf('/');
/** 封装后:/es/order/orderInfoQuery.htm*/
var urlStr = browserUrl.substring(spritIndex1, browserUrl.length + 1);
/** 上一次点击的菜单地址(C) */
var spritIndex2 = document.referrer.replace('/', 'a').replace('/', 'a').indexOf('/');
var lastUrl = document.referrer.substring(spritIndex2, browserUrl.length + 1);
for (var int = 0; int < liStr.length; int++) {
if ($(liStr[int]).children("a").attr("href") == "#") {
var childLi = $(liStr[int]).children("ul").children();
for (var int2 = 0; int2 < childLi.length; int2++) {
if (urlStr == $(childLi[int2]).children("a").attr("href")) {
$(liStr[int]).children("a").css({"color" : "white",background : "rgba(55,114,151,1)"});
$(liStr[int]).children("ul").css({display:"block"});
return;
}else{
if (lastUrl == $(childLi[int2]).children("a").attr("href")) {
$(liStr[int]).children("a").css({"color" : "white",background : "rgba(55,114,151,1)"});
$(liStr[int]).children("ul").css({display:"block"});
return;
}
}
}
} else if (urlStr == $(liStr[int]).children("a").attr("href")) {
$(liStr[int]).children("a").css({"color" : "white",background : "rgba(55,114,151,1)"});
return;
} else if (int == (liStr.length-1)) {
for (var int3 = 0; int3 < liStr.length; int3++) {
if (lastUrl == $(liStr[int3]).children("a").attr("href")){
$(liStr[int3]).children("a").css({"color" : "white",background : "rgba(55,114,151,1)"});
return;
}
}
}
}
}
树形菜单格式:
<ul>
<li><a href="地址">a</a></li>
<li><a href="地址">b</a></li>
<li><a href="地址">c</a></li>
<li><a href="#">d</a>
<ul>
<li><a href="地址">a</a></li>
<li><a href="地址">b</a></li>
</ul>
</li>
</ul>
function openMenu(menuId){
if ($("#"+menuId+" .childrenMenu").css("display") == "none" || $(".childrenMenu").css("display") == "") {
$("#"+menuId+" .childrenMenu").css({display:"block"});
}else{
}
}