Question

非常简单的问题：

我有一个表单（登录名/密码）放在一个下拉菜单中，只有当鼠标悬停在图标和表单上时才会出现。即，mouseleave并且它消失了。这是脚本：

$(document).ready(function() {
  $('.headermenushow').hover(function () {
    $(this).next('.dropmenu').slideDown(50);
  });
  $('.navselector').mouseleave(function () {
    $('.dropmenu').fadeOut(50);
  });
});

直接前进的东西。问题是，一旦我点击文本输入字段，脚本就会将其注册为mouseleave，表单将消失。我需要表格在填写时保持可见！

任何想法如何解决这个问题？

Answer 1

我不明白是否有悬停＆amp;不同类的mouseleave事件。然而，悬停结合了mouseenter＆amp; mouseleave events（Refer this）。所以你不需要有一个不同的mouseleave事件。

$(<Selector>).hover(functionToHandleWhenMouseEnters, 
                             functionToHandleWhenMouseLeaves);

我在下面列出了一个简单的例子。

示例：（fiddle）

HTML：

<div id="nav_bar">
    <a id="option">Hover menu</a>
    <ul id="dropmenu">
        <li>a</li>
        <li>b</li>
    </ul>
</div>

JavaScript的：

$(document).ready(function() {
  $("#dropmenu").hide();
  $("#option").hover(
    function () {
        $(this).next('#dropmenu').slideDown(50);
    },
    function () {
        $(this).next('#dropmenu').slideUp(50); 
        //$(this).next('#dropmenu').fadeOut(500);
    });
});

jquery如何修复由输入字段禁用的悬停show（）效果？

1 个答案: