悬停(function(){未正确选择

时间:2015-02-19 03:46:48

标签: javascript jquery css

我想让父母李在悬停时展示孩子。这是代码

jQuery(document).ready(function( $ ) {

      $(".menu").hover(function(){
        var target = $(this).parent().children(".sub-menu > li  a");
        $(target).slideToggle(800);
      });


    })

使用这个html,将鼠标悬停在“第2阶段”将取消隐藏资产和财产,徘徊在第1阶段,将隐藏资产和财产,但会泄露方法和收购。

<ul id="menu-sidebarnav" class="menu">
    <li id="menu-item-51" class="drawer menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-51">
    <a href="/stage-1/">stage 1</a>
        <ul class="sub-menu">
            <li id="menu-item-53" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-53">
            <a href="/opportunity/methodology/">Methodology</a></li>
            <li id="menu-item-52" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-52">
            <a href="/opportunity/acquisitions/">Acquisitions </a></li>
        </ul>
</li>
<li id="menu-item-54" class="drawer menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-54">
<a href="/stage-2/">stage 2</a>
        <ul class="sub-menu">
            <li id="menu-item-58" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-58">
             <a href="/competence/assets/">Assets</a></li>
             <li id="menu-item-57" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-57">
             <a href="/competence/property/">Property</a></li>
        </ul>

1 个答案:

答案 0 :(得分:0)

我认为您需要将li元素悬停,然后切换.sub-menu内的li项,以便

jQuery(function ($) {
    $(".menu > li").hover(function () {
        $(this).find(".sub-menu").slideToggle(800);
    });
})

演示:Fiddle