对于不同元素上的不同事件，具有相同功能的jQuery.one（）

我在页面上有一个介绍，当按下某个键或某个元素被点击时，它将消失。我将为这两个事件使用相同的功能，但由于页面被大量修改，事件只应触发一次，无论触发哪种方式。对于不同元素上的不同事件，具有相同功能的jQuery.one（）

我的功能：

function start() { 
    $('.intro').remove(); 
    $('.something-else').show(); 
}

如何我绑定的事件：

$('body').keypress(start); 
$('.intro').click(start);

如果事件是相同的，我可以说

$('body, .intro').one('click', start);

如果这两个事件是发生在我可以说相同的元素：

$('.intro').one('click keypress', start);

如何将两者结合：具有不同的元素和不同的事件，并且该函数只能被调用一次？

来源

2013-06-23 Daniel Böhmer

我想你可以使用一个'（）'而不是'在（）'这个 – landons

原帖说一个（），但阿什温编辑它的（），这是不对的。 –

啊。我把它推回 – landons

我不认为这个解决方案是一个干净的明确办法，但使用的.one()和.trigger()的组合来完成。因为您在其中一个绑定项上调用$(".intro").remove()，所以事件处理程序隐式解除绑定。 Sample Fiddle

不包括在小提琴中看到的html，这是代码。

// Your event handler 
function start() { 
    $("#intro").remove(); 
    $("#main").show(); 
    console.log("start handler called"); 
} 

// Handle the keypress event 
$("body").one("keypress", start); 

// Allow user to click through the intro, but trigger the keypress handler on the body which is a one-time event handler) 
$("#intro").one("click", function() { $("body").trigger("keypress"); });

来源

2013-06-24 00:29:25 veritasetratio

最简单的解决方案是存储您的函数是否被调用。

var started = false; 
function start() { 
    if(started) return; 

    $('.intro').remove(); 
    $('.something-else').show(); 

    started = true; 
}

然后你的函数只能被调用一次，其他的调用都会被忽略。

来源

2013-06-23 23:02:49

同样适用于这里。使用标志变量是绝对有可能的。我不认为这是完全可能的，但让我们假设用户碰巧点击并同时按下一个键：你认为这是线程安全的吗？ –

是的，我认为是。我认为代码不可能同时执行两次。 –

@dboehmer JavaScript是单线程的，事件被添加到队列并按FIFO顺序执行。单击事件和按键事件无法同时触发。 –

使用两行代码来完成;）

$('body').one('keypress', start); 
$('.intro').one('click', start);

编辑： 您应该手动取消绑定其他的回调，以免以后运行时，意外。

来源

2013-06-23 23:05:46 landons

那么，我当然知道我可以做到这一点。问题的意图是将事件处理转移到jQuery。我发现'one（）'非常有用，并希望在我的情况下可以使用它。 –

对于不同元素上的不同事件，具有相同功能的jQuery.one（）

回答

相关问题