1

我的页面上有一个介绍，当按下某个键或单击某些元素时它会消失。我将对这两个事件使用相同的函数，但由于页面被大量修改，无论以哪种方式触发，事件都只会触发一次。

我的功能：

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

我如何绑定事件：

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

如果事件是一样的，我可以说

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

如果这两个事件都发生在同一个元素上，我可以说：

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

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

4

3 回答 3

1

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

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

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

    started = true;
}

那么你的函数只能被调用一次，其他所有调用都将被忽略。

于 2013-06-23T23:02:49.143 回答
0

使用两行代码即可完成；）

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

编辑： 您应该手动取消绑定另一个回调，以免稍后意外运行。

于 2013-06-23T23:05:46.733 回答
0

我不认为这个解决方案作为一种明确的方法是干净的，而是使用 和 的组合来完成.one()的.trigger()。因为您调用$(".intro").remove()绑定项之一，所以事件处理程序是隐式未绑定的。样品小提琴

排除小提琴中看到的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-24T00:29:25.527 回答