用户选择一个选项后隐藏div

Question

我没有找到我正在寻找的答案，所以我为什么要创建这个问题。 我有一个div显示另一个点击但我需要隐藏它（点击时出现的div）用户选择其中一个选项后，我该怎么做？

当用户点击“#showmenu”时，会出现div“.mob”，点击其中一个“.mob”li后，“。mob”div消失。

PS：抱歉我的英语不好。

HTML：

<div id="showmenu"><img src="images/mobile.png" /></div>
<div class="mob" style="display: none;">
   <ul>
      <a data-scroll href="#home"><li>INÍCIO</li></a>
      <a data-scroll href="#servicos"><li>EU FAÇO</li></a>
   </ul>
</div>

码：

$(document).ready(function() {
    $('#showmenu').click(function() {
            $('.mob').slideToggle("fast");
    });
});

Answer 1

我不知道你正在使用的bootstrap或jquery插件，但根据给出的内容，我会说这应该工作。

$(document).ready(function() {
    $('#showmenu').click(function() {
            $('.mob').slideToggle("fast");
            $('.mob a').click(function () {
                 $('.mob').slideToggle("fast");
             });
    });
});

请注意，此处存在性能问题，即可以更好地优化代码以搜索特定div中的类或元素而不是整个文档

Answer 2

如果你不打算去任何地方，那些真的应该是<a>吗？ 他们可以只是<li>吗？

在那之后，我想你想给你的<li>提供id，然后创建一个类似你为$('showmenu').click...所做的功能$('showmenu').click...这将隐藏.mob。

或者如果<li> all得到同样的处理，也许给它们所有相同的类，并且只为该类提供一个函数。