0

次のようなhtmlコードがあります。

<ul>
    <li class="curent"><a href="home.html">Home</a></li>
    <li>
        <a href="javascript:void(0)">Products</a>
        <ul class="sub">
           <li><a href="samsung.html">Samsung</a></li>
           <li><a href="lenovo.html">Lenovo</a></li>
         </ul>
    </li>
    <li><a href="catalog_grid.html">News</a></li>
</ul>

http://img38.imageshack.us/img38/5795/70a.png

タグをクリックすると、li タグの親が強調表示されます。このコードを試してみましたが、ul has sub class のタグでは機能しません:

var this_url = window.location.href;

$('#block_nav_primary ul li').each(function() {
    if ($(this).children().attr('href') == this_url) {
        $('#block_nav_primary ul').find('li[class="curent"]').removeClass('curent');
        $(this).addClass('curent');
    }
});

ここで誰かが私を正しい方向に向けることができますか?

ご協力いただきありがとうございます！

P/S: このスレッドのように見えます Jquery を使用してナビゲーション メニューで親リンクを強調表示する

4

4 に答える 4

1

これを試して：

$("ul a").click(function () {
    $(this).parent().parent().addClass("blue");
});

また

$("ul a").click(function () {
    $(this).closest("ul").addClass("blue");
});

どちらの場合も CSS:

.blue > a {
   color: blue;
}

JSFiddleは非常によく似たシナリオです。

于 2013-07-04T08:22:58.553 に答える
1

私はあなたの言い回しをよく理解していませんが、サブリスト内のものを含むすべての LI タグに同じ効果を適用したいですか?

これを置き換えます：

$('#block_nav_primary ul li').each(function() {

これとともに：

$('#block_nav_primary ul').find('li').each(function() {
于 2013-07-04T08:23:43.957 に答える
1

Aタグがタグ全体の幅を占めるようにスタイリングしてみてください。タグLIをクリックするとA、タグ全体が強調表示されます。そのための CSS コードは次のようになります。

li a {display: block; width: 100%; padding: 10px 0; background-color: pink;}
li a:hover {background-color: orange;}
于 2013-07-04T08:41:23.260 に答える
1

試す

val items = $('#block_nav_primary ul li').click(function(){
    items.filter('.current').removeClass('current');
    $(this).addClass('current')
})
于 2013-07-04T08:27:12.340 に答える