Question

我有一小段代码，如下：

$("div.footerMenu li").click(
    function () {
        $("div.onScreen").hide();
        $(this).children("div.onScreen").fadeIn('fast');    
    },function(){
        $("div.onScreen").hide();
});//click

当我点击<li> div .onScreen很好地显示，但是当我点击这个div时，刚出现的函数隐藏并再次显示，但我不希望它执行再次这个功能。所以我的问题是：我怎么能以某种方式“从Javascript中分离/排除/隐藏”这个div？

更新

问题是，使用此方法和其他人使用.one（），菜单的其余部分无效。该网站存在问题here。我希望这个div显示在那里，当我点击它时，但当我点击他们的项目<li>时，我想要显示其他div（子菜单）（警告 - 该网站上的大图像）。< / p>

html看起来像这样：

<div class="footerMenu"> <ul> <li>HOME<div class="onScreen"><div style="padding:50px;"><img src="fillTxt.png"></div></div></li> <li>PLENER<div class="onScreen"> <div style="padding:50px;"><img src="fillTxt2.png"></div></div> </li> <li>STUDIO<div class="onScreen"> <div style="padding:50px;"><img src="fillTxt.png"></div></div> </li> <li>INNE<div class="onScreen"> <div style="padding:50px;"><img src="fillTxt2.png"></div></div> </li> </ul> </div>

Answer 1

简单的解决方案是：

$('div.footerMenu li').unbind('click');

但是如果您在选择器上有多个点击处理程序，您可能只想一次删除一个。这样做的方法是存储对传递函数的引用：

function hideItem()
{
  ...code...
  //unbind the click event
  $(this).unbind('click', hideItem);
}

$('div.footerMenu li').click(hideItem);

Answer 2

如果您只想处理一次事件，可以使用one()方法：

$("div.footerMenu li").one("click", function() {
    $("div.onScreen").hide();
    $(this).children("div.onScreen").fadeIn("fast");    
});

Answer 3

您可以使用.one()：

$("div.footerMenu li").one('click', function(){
    things_to_happen_only_once();
    // unbinding happens automatically
});

如何告诉JavaScript什么都不做？

3 个答案: