Javascript JQuery在firefox和chrome中无法正常工作

我目前正在开发一个ASP.NET网页，遇到了我遇到过的最令人恼火的问题

在过去的三天里，我一直在研究这个问题，没有找到任何人有这个问题，更不用说任何解决方案了

我已经用HTML/CSS创建了一个菜单/子菜单，我正在给子菜单添加某种切换效果，使其要么向下滑动，要么淡入（我已经尝试了这两种方法，两种方法都得到了相同的结果）

在InternetExplorer中，它工作得很好。我可以将鼠标悬停在菜单上，它将向下滑动或正确淡入，然后当我移开鼠标时，它将消失

在Chrome/Firefox中，我没有那么幸运。子菜单开始隐藏，然后如果我将鼠标悬停在它上面一次，它就会出现。如果我移开鼠标，它会立即关闭，然后自行重新打开。在这一点上，它是不可逆转的。如果我将鼠标悬停在它上面，它就会消失，如果我再次移开鼠标，它就会重新出现。这将继续发生，直到页面重新加载

这是HTML的菜单

<ul id="menu">
        <li><a href="Default.aspx">Home</a></li>
        <li><a href="Services.aspx">Services</a>
            <ul id="submenu">
                <li>Custom CRM</li>
                <li>Website Development</li>
            </ul>
        </li>
        <li><a href="About.aspx">About</a></li>
        <li><a href="Contact.aspx">Contact Us</a></li>
    </ul>

最后，这里是我为此创建的JQuery代码

<script type="text/javascript">

    $(document).ready(function () {
        $("#menu ul").parent().hover(function () {
            $("#submenu").stop(true, true).fadeToggle("slow");
        });
    });

</script>

$（文档）.ready（函数（）{
$（“#菜单ul”）.parent（）.hover（函数（）{
$（“#子菜单”）.stop（真，真）。fadeToggle（“慢”）；
});
});

非常感谢您的帮助。谢谢大家!

---

--标记

主要是，

悬停

接受两个功能参数（一个用于mouseover，一个用于mouseout）。其次，我建议在上使用

：

$('#menu > li').on({
  mouseover: function() {              
    $(this).children('ul').slideDown(300);
  },
  mouseout: function() {
    $(this).children('ul').stop(true, false).hide();
  }
});

通过jQuery的检查和平衡，如果
li
没有子
ul
，它将返回

这就是你想要的吗？（如果没有，请随时指导我！）

我将jquery完全更改为淡入子元素，最初隐藏子菜单。还从css中删除了display:none以帮助实现这一点（因为它现在通过.hide（）隐藏）

干杯，
我不需要尝试这个，就可以知道这将用链式效应填满队列，您可以添加一个
stop
。我只是想说明它是如何工作的。它工作得更好，但我发现的唯一问题是，如果我使用mouseover和mouseout，从技术上讲，当我离开父菜单项而试图转到子菜单项时，会出现mouseout事件。如果我转到一个子菜单项，你有什么想法吗？啊，你可以将事件附加到
li
而不是
#子菜单。将
#菜单ul
更改为
display:block
，子菜单ul
更改为
width:auto；高度：自动。我将更新我的答案以反映这一点。你确定吗？我很感激你的帮助，相信我。但我还是有麻烦。我做了上面的更改，但现在根本没有效果，好像它检查了错误的项目。非常好。非常接近。然而，在Chrome中，它第一次起作用，但当你将鼠标移出时，无论你是进去还是出去，它都不再起作用。此外，在InternetExplorer中，如果您将鼠标移出，它开始淡出，然后再将鼠标移回，它将冻结在半淡出状态，而不是淡出更多。不知道为什么。。。非常感谢！是的，我感觉Chrome可能和上面一样。刚刚测试了你说的话，如果你给它5秒钟左右的时间，它就会重新开始工作。我认为这与淡出的缓慢时间有关。例如，在这里我把它改为show（）和hide（），看起来还可以@标记或者，您可以添加一个时间~50-75，而不是使用“慢”来表示时间，例如.fadein（50）和.fadeout（50）
$('#menu > li').on({
  mouseover: function() {              
    $(this).children('ul').slideDown(300);
  },
  mouseout: function() {
    $(this).children('ul').stop(true, false).hide();
  }
});