問(wèn)題描述

如下圖，這個(gè)html的header是共用的，我現(xiàn)在想讓頁(yè)面跳轉(zhuǎn)過(guò)去，但又要保證樣式在點(diǎn)擊跳轉(zhuǎn)之后有保持select，我用location.href在js里控制跳轉(zhuǎn)還是不行，應(yīng)該是重新加載了，

該咋么辦捏，哪位大哥幫幫我~

我想搞成segment這種

問(wèn)題解答

方案一：根據(jù)你的網(wǎng)址確定哪個(gè)a標(biāo)簽高亮顯示 1.獲取網(wǎng)址：

console.log(location.href)///q/1010000009520710 我測(cè)試的是當(dāng)前頁(yè)

2.根據(jù)網(wǎng)址查詢(xún)關(guān)鍵詞，參考你的代碼可以發(fā)現(xiàn)每個(gè)a標(biāo)簽網(wǎng)址都有關(guān)鍵詞 首頁(yè)=‘’ 招聘美工=‘shejishi’ 美工作品=‘zuopin’3.根據(jù)你所找到的關(guān)鍵詞 判斷哪一個(gè)a標(biāo)簽高亮

注：這個(gè)比較簡(jiǎn)單不過(guò)可能不會(huì)很靈活，如果導(dǎo)航不確定的話(huà)，關(guān)鍵詞也就不確定，這樣不便于代碼維護(hù)

方案二：通過(guò)網(wǎng)址傳參1.修改a鏈接‘sheijishi/list?index=1’,‘zuopin/list?index=2’2.通過(guò)a鏈接獲取index值，設(shè)置對(duì)應(yīng)a標(biāo)簽高亮注： 這個(gè)比較靈活，只是看上去網(wǎng)址有點(diǎn)復(fù)雜，不美觀(guān)，還有個(gè)小問(wèn)題就是如果用戶(hù)直接輸入‘shejishi/list’的話(huà)就沒(méi)有對(duì)應(yīng)的高亮效果了

方案三：localStorage 剛才樓上那位大神也都提過(guò)了，正常操作的話(huà)是沒(méi)有問(wèn)題的，如果用戶(hù)點(diǎn)擊過(guò)‘sheijishi/list’，有直接新標(biāo)簽頁(yè)打開(kāi)首頁(yè)的話(huà) 高亮的會(huì)是‘招聘美工’菜單

方法挺多，看你個(gè)人想法確定具體方案

判斷下當(dāng)前頁(yè)面是哪個(gè)li，然后給它的子a標(biāo)簽加上加上select就行了吧

例如 每個(gè)頁(yè)面定義一個(gè) var currentTab = ’’;

比如美工作品頁(yè)面 var currentTab = ’zuopian’;

html<ul><li class=’shejishi’><a>招聘美工</a></li><li class=’zuopian’><a>美工作品</a></li></ul>js$(function(){ var currentTab = ’zuopian’; $(’.’+currentTab).find(’a’).addClass(’select’); })回答3：jsp是這樣處理的：

<jsp:include page='menu.jsp'> <jsp:param name='item' value='jquery' /></jsp:include>

在menu.jsp取得參數(shù)值的方法： ${param.item}

<script type='text/javascript' src='http://www.piao2010.com/media/js/menu.js' data-item='jquery'></script>

在menu.js里取得參數(shù)：

var item = $('#menu-js').data('item');alert('=='+item);回答4：

跳轉(zhuǎn)之后 ，把tab的index給帶過(guò)去，，， 用js處理下，

最簡(jiǎn)單的辦法就是傳參，如果你對(duì)以前的瀏覽器不要求的話(huà)可以用localStorage來(lái)保存相關(guān)值，到哪個(gè)頁(yè)面就讀值然后初始化就行了

如果是php 可以這樣<a class='<?php if(($_SERVER[’REQUEST_URI’]==’/zhaopin/list’)){echo ’select’;}else{echo ’’;} ?>'>