Question

说我有一个带有字段和提交按钮的表单。

我希望在发生任何动作（点击或更改）时运行相同的功能。

目前我已经设置了这种方式：

$("#btn-search").click(function() {
    $(".forminput").change();
});

$(".forminput").change(function() {
    //do stuff
});

然而，这似乎多次触发//做东西部分。有没有更好的方法，或者其他地方可能出现问题？

Answer 1

如果您的事件处理程序不需要处于.forminput的上下文中（即它根本不使用$(this)），那么您可以创建一个用于他们两个：

function clickChangeHandler(){
    // do stuff
}

$("#btn-search").click(clickChangeHandler);
$(".forminput").change(clickChangeHandler);

Answer 2

您可以创建一个将为您想要的事件调用的函数。例如：

$('#one').click(foo);
$('#two').change(foo);

function foo(){
    // do stuff... this and $(this) are also usable.
}

Answer 3

两种情况都可以使用一个eventHandler。如果您需要区分事件，可以使用事件参数以不同方式处理它们

function eventHandler (event) {}

$("#btn-search").click(eventHandler);

$(".forminput").change(eventHandler);

Answer 4

以下应该是更好的方法，应该防止您的代码多次触发。

function doStuff(e) { 
    e.stopImmediatePropagation();
    // do stuff
}
$('.forminput').on('change', doStuff);
$('#btn-search').on('click', doStuff);

为不同元素上的两个不同事件运行相同的事件处理程序

4 个答案: