Javascript 显示/隐藏jQuery菜单单击函数

我的菜单有以下代码，问题是我希望它在单击其中一个选项时立即隐藏/关闭，而不是在X按钮处关闭：

这是HTML

菜单

试试这个：

$( ".icon" ).bind( "click", function() {
    $(".mobilenav").fadeToggle(500);
    $(".top-menu").toggleClass("top-animate");
    $(".mid-menu").toggleClass("mid-animate");
    $(".bottom-menu").toggleClass("bottom-animate");
});

这将把click函数绑定到类。另外，还有一个旁注，用于观察脚本的放置位置。从我个人的经验来看，将所有js代码（内联和外部代码）放在标记之前（即使使用document.ready（））效果最好，但这可能只是我个人的偏好

---

你能在这里发布html吗？顺便说一句，我怀疑这些类中的一些嵌套方式会导致调用冲突。另外，如果.dialog是.mobilenav的子对话框，

fadeOut

可能与

fadeToggle

冲突。另外，请注意，单击时有两个侦听器。大概是一个点击图标。图标也是一个点击文档。先检查那两条路。如果您也能发布一个JSFIDLE，那将很有帮助。谢谢，但仍然没有什么，在我单击其中一个选项后，菜单将保持打开状态。尝试将“.icon”切换为“a”。这可能会奏效@GregoryLoginow谢谢大家，你是个天才，为一个“a”做了完美的修改@GregoryLoginow没问题很乐意帮忙1好，我确实把“.图标”改成了“a”，但现在只要我点击一个标签，菜单就会打开。。。

<a href="javascript:void(0)" class="icon"> 
<div class="MENU"> 
 <div class="menui top-menu"></div> 
 <div class="menui mid-menu"></div> 
 <div class="menui bottom-menu"></div> 
</div> 
</a>

$(document).ready(function () {
$(".icon").click(function () {
    $(".mobilenav").fadeToggle(500);
    $(".top-menu").toggleClass("top-animate");
    $(".mid-menu").toggleClass("mid-animate");
    $(".bottom-menu").toggleClass("bottom-animate");
});

$( ".icon" ).bind( "click", function() {
    $(".mobilenav").fadeToggle(500);
    $(".top-menu").toggleClass("top-animate");
    $(".mid-menu").toggleClass("mid-animate");
    $(".bottom-menu").toggleClass("bottom-animate");
});