如何绑定一个JQuery事件使其仅触发一次？

我有一个帮助弹出窗口，我想关闭其他地方点击。这里是我有什么：如何绑定一个JQuery事件使其仅触发一次？

$('.help[data-info]').click(function(){ 
    $('.info[a complicated selector]').toggle(400); 
    $('*:not(.info[the complicated selector]).one('click','',function(){ 
    .info[the complicated selector].hide(400); 
    }); 
})

但是一（）不是我想在它为页面上的每个元素触发之前。我只想让它射击一次。

来源

2011-12-11 Leo Jiang

您在第3个选择器中缺少'''。也是''''one（）'的第二个参数？ – kubetz

它看起来像你将事件处理程序附加到你的dom中除了帮助弹出窗口中的每个元素？嗯......

如何：

创建一个单一的“面具”的div覆盖整个屏幕，但是是透明的（不透明度：0.0）。将单击事件处理程序只有附加到该掩码div。然后打开覆盖div顶部的info div。点击页面上的任何地方，除了info div之外，事件将被mask div捕获，然后到达其下的任何东西。在你的事件处理程序中，隐藏（）info div，并完全删除mask div。在对此进行测试/实验时，请先从部分不透明蒙版开始，而不是完全透明）。

来源

2011-12-11 16:48:06 smendola

+1。比他原来的方法更优雅的解决方案。 – shesek

如果你只是想在您所有的元素火一次，那么你可能需要手动解除绑定所有的事件处理程序被点击任何一个时，或使用一个标志：

$('.help[data-info]').click(function(){ 
    $('.info[a complicated selector]').toggle(400); 
    var sel = $('*:not(.info[the complicated selector]); 
    function hideInfo() { 
    .info[the complicated selector].hide(400); 
    sel.unbind('click', hideInfo); 
    } 
    sel.bind('click', hideInfo); 
})

来源

2011-12-11 16:30:18 jfriend00

。利用一个布尔变量它设置为true，第一次点击之后，所以它不会再次触发动作：

$('.help[data-info]').click(function() { 
    var clicked = false; 
    $('.info[a complicated selector]').toggle(400); 
    $('*:not(.info[the complicated selector]').one('click','',function() { 
    if (!clicked) { 
     .info[the complicated selector].hide(400); 
     clicked = true; 
    }  
    }); 
})

来源

2011-12-11 16:31:57 alessioalex

几个选项：

您可以使用blur事件，而不是将点击事件绑定到除弹出窗口以外的任何事件。
在弹出窗口和页面的其余部分之间添加一个透明的完整页面div。透明div上的点击事件可以处理隐藏。

来源

2011-12-11 16:34:15

如何绑定一个JQuery事件使其仅触发一次？

回答

相关问题