天天看點

網頁中那些遇到過的導航選中狀态actived selected

1.頁面不重新整理時:

(jquery)

$('.nav li').click(function () {
     alert("111");  
     $(this).addClass('actived').siblings().removeClass('actived');
});
           
<div class="nav">
    <ul>
        <li class="actived">
            <a href="#" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow" >
                <img src="images/icon1.png"/><br />
                分類1
            </a>
        </li>
        <li>
            <a href="#" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow" >
                <img src="images/icon2.png"/><br />
                分類2
            </a>
        </li>
        <li>
            <a href="#" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow" >
                <img src="images/icon3.png"/><br />
                分類3
            </a>
        </li>
        <li>
            <a href="#" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow" >
                <img src="images/icon4.png"/><br />
                分類4
            </a>
        </li>
        <li>
            <a href="#" target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow"  target="_blank" rel="external nofollow" >
                <img src="images/icon5.png"/><br />
                分類5
            </a>
        </li>
    </ul>
</div>
           

2.頁面重新整理時:

(.net)

public string iurl;
iurl= Request.Url.ToString();
           

判斷網址是否包括目前網址,如果包含設定class為actived

<div class="foot">
        <ul>
            <li class="<%=iurl.Contains("index")?"actived":"" %>"">
                <a href="index.aspx" target="_blank" rel="external nofollow" >
                    <img src="images/icon1.png"/><br />
                    首頁
                </a>
            </li>
            <li class="<%=iurl.Contains("come")?"actived":"" %>">
                <a href="come.aspx" target="_blank" rel="external nofollow" >
                    <img src="images/icon2.png"/><br />
                    我們
                </a>
            </li>
            <li class="<%=iurl.Contains("news")?"actived":"" %>">
                <a href="news.aspx" target="_blank" rel="external nofollow" >
                    <img src="images/icon3.png"/><br />
                    新聞
                </a>
            </li>
            <li class="<%=iurl.Contains("join")?"actived":"" %>">
                <a href="join.aspx" target="_blank" rel="external nofollow" >
                    <img src="images/icon4.png"/><br />
                    入會
                </a>
            </li>
            <li class="<%=iurl.Contains("contact")?"actived":"" %>">
                <a href="contact.aspx" target="_blank" rel="external nofollow" >
                    <img src="images/icon5.png"/><br />
                    聯系
                </a>
            </li>
        </ul>
</div>
           

繼續閱讀