jquery superfish - onhide事件发射太快

时间:2013-03-07 20:55:48

标签: jquery superfish

我正在使用带有jquery的superfish(http://users.tpg.com.au/j_birch/plugins/superfish/#aa)来进行菜单控制。几乎所有元素都在嵌套的

  • 元素中设置。每次超级鱼菜单关闭时我都会隐藏一个菜单项(我在其他地方用.show()显示)。所以,我的superfish初始化看起来像这样:

    $(document).ready(function () {
        $("#menu").superfish({
              delay: 400,
              onHide: function () { $("#HideThis").hide(); }
         });
     });
    

    然而,它隐藏了HideThis,将鼠标悬停在HideThis上(没有悬停事件绑定到该元素)。这使得菜单项不可用,因为当您尝试单击它而不是菜单关闭时它会隐藏。似乎没有任何其他事件可以适合我的目的,任何想法如何通过superfish进行这项工作?

    我使用的HTML看起来像这样:

    <ul id="menu">
      <li id="Stuff"><span>Stuff</span>
         <ul>
            <li id="HideThis" ><span>Hide This</span>
               <ul>
                  <li><span>Hidden Stuff</span></li>
               </ul>
            </li>
            <li id="DontHideThis" ><span>Dont Hide This</span></li>
         </ul>
      </li>
    </ul>
    

    编辑: 我能够找到问题:'onHide'事件会在每次子菜单隐藏时触发,而不仅仅是整个菜单隐藏时(有趣的是,它也会在菜单首次显示时触发;所以onHide比你更频繁地发生期待)。所以,我最终必须像这样过滤onHide:

    $(document).ready(function () {
       $("#menu").superfish({
          delay: 400,
          onHide: function () { if ($('ul.sf-menu li.sfHover').length == 0) $("#HideThis").hide(); }
       });
    });
    

    并且'if'语句仅在折叠所有菜单时才为真。

  • 1 个答案:

    答案 0 :(得分:1)

    你最好为这类事创造一个jsFiddle。 I made you one here除了类.sf-menu之外还添加了一些粗略的样式来悬挂所述样式。从我所看到的,你的代码似乎按你想要的方式工作。如果这没有帮助,请随时描述我遗漏的内容。