如何组合不同的事件触发器

Question

我是 jQuery 的新手，希望有人能帮助我。

我有一个由各种元素触发的 JS 函数/类不同之处在于，其中一些事件是由点击触发的，而另一些则是通过键盘输入等触发的。

到目前为止，我有以下示例，它按预期工作，但我想知道是否有办法 将它们组合起来，因为这里唯一的区别是触发器（点击、按键等） 并避免重复代码。

如果有任何其他建议来写这个不同的，请也让我知道。

我的jQuery（示例）：

$(document).on('keyup', '.calcMinus, .calcPlus', function(e){
    var row = $(e.target);
    $(row).closest('table').find('td.calcSum').each(function(index){
        calculateSums(row, index);
    });
});
$(document).on('click', '.trAdd, .trDelete, .trDown, .trUp', function(e){
    var row = $(e.target);
    $(row).closest('table').find('td.calcSum').each(function(index){
        calculateSums(row, index);
    });
});
// ...

我的JS函数：

function calculateSums(row, index){
   // do stuff
}

非常感谢，麦克

Answer 1

$(document).on('keyup', '.calcMinus, .calcPlus', combined);
$(document).on('click keyup', '.trAdd, .trDelete, .trDown, .trUp', combined);

function combined(e){
    var row = $(e.target);
    $(row).closest('table').find('td.calcSum').each(function(index){
        calculateSums(row, index);
    });
}

Answer 2

将事件处理程序中的代码提取到一个函数中，然后从两个现有的处理程序中调用它：

function handleEvent(row) {
    $(row).closest('table').find('td.calcSum').each(function(index){
        calculateSums(row, index);
    })
}

$(document).on('keyup', '.calcMinus, .calcPlus', function(e){
    handleEvent($(e.target));
});
$(document).on('click', '.trAdd, .trDelete, .trDown, .trUp', function(e){
    handleEvent($(e.target));
});

如何组合不同的事件触发器

How to combine different event triggers

javascript

jquery

events

triggers