0

サブメニューをクリックしたとき、メインメニューのハイライトの背景が欲しいです。

次のように私のコーディング：

<div id="dmenubg">
    <ul id="nav" class="drop">
     <li><a href="index.php">Home</a></li>
        <li><a href="#">Services</a>
            <ul>
                <li><a href="aaa.php">AAA</a></li>
                <li><a href="#">BBB</a></li>
                <li><a href="#">CCC</a></li>
            </ul>
        </li>
    </ul>
</div>
<script type="text/javascript">
    $(document).ready(function(){
        var str=location.href.toLowerCase();
        $(".drop li a").each(function() {
            //alert(str.indexOf(this.href.toLowerCase()));
            if (str.indexOf(this.href.toLowerCase()) > -1) {
                $("li.highlight").removeClass("highlight");
                $(this).parent().addClass("highlight");
            }
        });
        $(".drop li ul a").each(function() {
                if (str.indexOf(this.href.toLowerCase()) > -1) {
                $(".drop.li.ul.highlight").removeClass("highlight");
                $(this).parent().addClass("highlight");
            }
        });
     })
</script>


Result of my menu:

Home      **Service**
          **AAA**
          BBB
          CCC

AAA アイテムをクリックすると、サービスと AAA が強調表示されます。

4

2 に答える 2

0

$(".drop > li > a") as Selector それよりも、メニューの最初のレベルのみを強調表示します。.drop li の下のすべてのアンカー リンクではありません。

これで問題が解決することを願っています

于 2013-04-05T05:39:25.810 に答える
0

JavaScript を少し変更しました。基本的な考え方は、一致するすべてのアンカーを調べてから、一致する有効なメニューの親があるかどうかを確認することです。

親のテキストだけを強調表示したい場合は、outerNav.find(">a").addClass() を実行する必要があることに注意してください。

$(".drop li a").each(function() {

  if (str.indexOf($(this).attr("href").toLowerCase()) > -1) {
       $("li.highlight").removeClass("highlight");
       $(this).parent().addClass("highlight");
       var outerNav = $(this).parent().parent().parent();
       if(outerNav.is("li")) {
          /* Use this code to highlight the entire ul contents */
          //outerNav.addClass("highlight");
          /* Use this code to highlight just the parent li a */
          outerNav.find(">a").addClass("highlight");
       }
  }
});
于 2013-04-03T05:24:44.337 に答える