From ff5c62bf8f18e05f3e86a9e900b803852bc53241 Mon Sep 17 00:00:00 2001 From: test Date: Thu, 6 Apr 2017 18:58:47 +0800 Subject: [PATCH 1/2] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E5=A4=B4=E9=83=A8?= =?UTF-8?q?=E8=8F=9C=E5=8D=95=E6=A0=8F=E4=B8=AD=E8=8F=9C=E5=8D=95=E8=A2=AB?= =?UTF-8?q?=E9=80=89=E4=B8=AD=E6=A0=87=E7=BA=A2=E7=9A=84=E9=80=BB=E8=BE=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit http://xxxx/tags/ http://xxxx/tags/yyyy 只要URL中http(s)://xxx/之后是tags之类的就标红相应的菜单 --- source/js/main.js | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/source/js/main.js b/source/js/main.js index cec051a3..e9c1f14a 100644 --- a/source/js/main.js +++ b/source/js/main.js @@ -3,14 +3,14 @@ var hasCurrent = false; $('#main-nav > li').each(function () { var url = window.location.href; - var lastIndex = url.length;//要截取的字符串最后一位的位置+1 - var lastSlashIndex = url.lastIndexOf("/"); - if (lastSlashIndex == lastIndex -1) { - lastSlashIndex = url.lastIndexOf("/",lastSlashIndex -1)//如果url的最后一个字符串是/,则修正最后一个斜杠的位置 - lastIndex--;//如果url最后一位是/,则不截取该位 + var matchKey; + for (key in themeMenus) { + if (url.match(new RegExp('^http(s)?://.+' + key + '/.*'))){ + matchKey = key; + break; + } } - url = url.substring(lastSlashIndex,lastIndex); - if(themeMenus[url] == $(this).text().trim()){ + if(themeMenus[matchKey] == $(this).text().trim()){ $(this).addClass('current-menu-item current_page_item'); hasCurrent = true; } else { From b80e2d1b0c55b120c2c06ce1f23aa65303811aa2 Mon Sep 17 00:00:00 2001 From: test Date: Thu, 6 Apr 2017 20:06:57 +0800 Subject: [PATCH 2/2] =?UTF-8?q?=E9=A6=96=E9=83=A8=E8=8F=9C=E5=8D=95?= =?UTF-8?q?=E6=A0=8F=E7=9A=84=E9=80=89=E4=B8=AD=E9=80=BB=E8=BE=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- source/js/main.js | 48 +++++++++++++++++++++++++++++------------------ 1 file changed, 30 insertions(+), 18 deletions(-) diff --git a/source/js/main.js b/source/js/main.js index e9c1f14a..537b943b 100644 --- a/source/js/main.js +++ b/source/js/main.js @@ -1,26 +1,38 @@ +(function(){ -// Highlight current nav item -var hasCurrent = false; -$('#main-nav > li').each(function () { - var url = window.location.href; - var matchKey; - for (key in themeMenus) { - if (url.match(new RegExp('^http(s)?://.+' + key + '/.*'))){ - matchKey = key; - break; - } + // Highlight current nav item + var hasCurrent = false; + + //把相对路径解析成绝对路径 + function absolute(href) { + var link = document.createElement("a"); + link.href = href; + return (link.protocol+"//"+link.host+link.pathname+link.search+link.hash); } - if(themeMenus[matchKey] == $(this).text().trim()){ - $(this).addClass('current-menu-item current_page_item'); - hasCurrent = true; - } else { + + //移出所有的菜单的选中样式 + $('#main-nav > li').each(function(){ $(this).removeClass('current-menu-item current_page_item'); + }); + var links = $('#main-nav > li > a'); + var urls = window.location.href; + //为什么要从后面往前面遍历?因为首页极有可能是https://xxxxx/, + //这样的话肯定能够匹配所有的项 + for (var i = links.length; i >= 0; i--) { + if(urls.indexOf(absolute(links[i])) != -1){ + $(links[i]).parent().addClass('current-menu-item current_page_item'); + //为什么还要设置hasCurrent?因为不排除首页是 + //https://xxxx/index.html格式的 + hasCurrent = true; + break; + } } -}); -if (!hasCurrent) { - $('#main-nav > li:first').addClass('current-menu-item current_page_item'); -} + + if (!hasCurrent) { + $('#main-nav > li:first').addClass('current-menu-item current_page_item'); + } +})();