3

我经常使用 jQuery.trigger()来处理重复事件。

例如，如果我有一个有四个导航按钮（上、下、左、右）的小部件，并且每个按钮上都绑定了一个事件处理程序，例如：

$('#up').on('click', function() {
    // move up
    ...
});

到目前为止，小部件运行良好，现在我想添加键盘快捷键，up/down/left/right arrow key以便每个按钮的工作方式与按下时完全相同up/down/left/right button。

在这种情况下，我经常使用.trigger()键盘快捷键作为这些按钮的包装器。

$(document).on('keydown', function(e) {
    // up arrow key
    if (e.keyCode == 38) $('#up').trigger('click');
    ...
});

这样使用是不好的做法.trigger()吗？

我认为当我将库作为黑匣子处理时非常方便。如果已经有一些按钮来帮助控制库，即使不知道库的 API，我也可以通过触发这些按钮上的点击事件来使用库的功能。

4

2 回答 2

5

这并不是一个非常糟糕的做法，但还有其他方法可以做到这一点，即使它们不一定更好，比如：

$('#up').on('click', clickHandler);

$(document).on('keydown', function(e) {
    if (e.which === 38) clickHandler();
});

function clickHandler() {
    //do stuff
}

或者

$(document).on('click keydown', function(e) {
    if (e.type == 'keydown' && e.which === 38) {
         // do stuff for key
    }else if (e.type == 'click' && e.target.id == 'up') {
         // do stuff when click on #up
    }
});

我猜这是基于意见的，但我更喜欢第一个，使用你调用的外部函数，而不是触发事件本身，即使他们做同样的事情。

我不会使用最后一个，因为它是委托的并在任何点击等时触发。

于 2013-07-18T15:16:47.310 回答
3

有些人会说这是不好的做法，有些人会说没关系，但它可能不是最容易理解的代码。相反，我建议定义一个相应的函数，然后从触发器中调用它。例如：

function doUp() {
    //your code for handling "up" functionality
}

$('#up').on('click', doUp);

$(document).on('keydown', function(e) {
    // up arrow key
    if (e.keyCode == 38) doUp();
    ...
});

对于其他键/按钮也是如此。

这样你就有了一个放置逻辑的地方，然后你可以从任何需要的地方调用它。

于 2013-07-18T15:16:36.247 回答