0

ユーザーがホバーしているカテゴリに最も近いサブメニューのみを表示するのに問題があります。ユーザーが任意のカテゴリにカーソルを合わせると、すべてのサブメニューが表示されます。

JQuery

<script type="text/javascript">
    $(document).ready(function(){
        $(".category").hover(function(){
            $(".submenu").show();
        });
    });

</script>

HTML

<div id="sidebar">
    <ul style="list-style-type:none;">
        <li><a class="category" href="#">Cars </a>
            <ul class="submenu" style="position:absolute; display:none;">
                <li><a href="#">Ford</a></li>
                <li><a href="#">Chevy</a></li>
                <li><a href="#">VW</a></li>  
            </ul>      
        </li>   
        <li><a class="category" href="#">Food </a>
            <ul class="submenu" style="position:absolute; display:none;">      
                <li>Fruits</li>      
                <li>Burgers</li>         
                <li>Veggies</li>     
            </ul> 
        </li>
    </ul> 

</div>
4

2 に答える 2

1

closest() は html ツリーを検索します。find() を使用して、ホバーされている要素の内部を調べたいと考えていますが、hover() の 2 番目のコールバックを使用して再び非表示にすることもできます。

編集コードから最も近い（）を削除したようです

$(".category").hover(function(){
        $(this).find(".submenu").show();
    },function(){
        $(this).find(".submenu").hide();
    } );
于 2012-06-05T15:16:51.453 に答える
1

$(".submenu").show();セレクターに一致するすべての要素を検索します。になる CLICKED アイテムに関連する要素を見つける必要があります$(this)。

試す：

 $(".category").hover(function(){
      $(this).next('ul').show();
 });

また

 $(".category").hover(function(){
      $(this).next('.submenu').show();
 });
于 2012-06-05T15:16:09.217 に答える