因此，我有了叠加菜单，单击叠加容器上的任何位置时，都可以使用脚本隐藏该菜单。我的问题是，事后我无法取消隐藏，因此，如果在第一次单击时将其隐藏起来，我将无法再次显示它。当我按菜单时，它什么也没显示。
有什么办法可以使事件重设吗？
$(function () {
$(document).on('click', '.box', function () {
$('.box').fadeOut( function () {
$(this).hide();
});
});
});
这是js小提琴：http : //jsfiddle.net/sqfyrkpo/
如果我正确理解您的问题，则想隐藏并显示菜单。在单击菜单输入时显示（您当前:checked在CSS中使用伪类执行此操作），然后在单击出现的覆盖框时隐藏？
如果是这样，为什么不使用JQuery取消选中输入。这样，叠加层将由复选框和CSS实质上控制，并使用JQuery进行控制。这样（已经使用了代码的基础）：
$(function () {
$(document).on('click', '.box', function () {
$('#toggle-nav').attr('checked', false);
});
});
这是更新的小提琴，向您展示：
http://jsfiddle.net/lee_gladding/sqfyrkpo/7/
还：
我认为您可能正在尝试使它过于复杂，使用复选框显示使用CSS，然后使用JQuery隐藏，这是两种不同的技术-分别和彼此不知。
理想情况下，使用复选框（hack）来切换其他CSS的目的是使用复选框来切换两种状态，而无需使用JQuery。
当您使用JQuery及其工作方式时，您可能想考虑使用JQuery来处理所有这些问题，而不是使用部分html复选框（hack）来处理JQuery，方法是使用一个切换类，例如active，在您的盒子上（显示/隐藏菜单）。这也将为您提供更大的标记灵活性，以及如何组织菜单。只是一个主意！
就像是：
$(function () {
$('#menuButton').on('click', function () {
$('.box').toggleClass('active');
});
$('.box').on('click', function () {
$(this).removeClass('active');
});
});
并更新CSS以使用active该类，类似于：
#menu .box.active
{
opacity: 1;
z-index: 400;
}
（示例中还对CSS进行了其他更新）
这是一个带有更改的HTML，CSS和JQuery的示例：http : //jsfiddle.net/lee_gladding/sqfyrkpo/18/
不管怎么说，无论采用哪种JQuery方法，都将限制您的用户启用JQuery才能使用菜单（严格不能完全访问）。因此，您可能还想考虑未启用JS的用户如何浏览页面。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句