events - 由同一个 jquery 函数处理的两个不同元素的提交和单击事件？

Question

我有一个提交按钮#next_step和一个链接#design_next_step。

当按钮提交或点击链接时，会触发相同的功能。

我怎么能做这样的事情？

$('#next_step').submit(), $('#design_next_step').click(){function(){ ... });

Answer 1

您可以使用标准 CSS 逗号来定义组选择器：

$('#next_step, #design_next_step').on('submit click', function(){ ... });

当按钮提交或点击链接时...

但是按钮没有提交，它们被点击了。submit事件与元素有关，而form不是button与input元素有关。假设id您显示的 s 用于按钮或链接元素，只需使用click事件：

$('#next_step, #design_next_step').on('click', function(){ ... });

根据您正在做的事情，您可能（也可能不）想要阻止事件的默认操作[通过接受event参数并调用preventDefault它，或者通过return false在处理程序中执行这将阻止默认和停止传播] . 例如，on links的默认操作click是跟随链接。

Answer 2

只需让两个事件处理程序调用相同的函数 F。

$('#next_step').submit(function() {
   F();
});
$('#design_next_step').click(function() {
   F();
});
var F=function() {
   . . .Write code here
}

Answer 3

您可以为链接和按钮提供相同的课程，然后您可以尝试执行以下操作

$('.className').click(function() {
    var item = $(this); // item that triggered the event

});

如果您想基于 ID 进行操作，请执行以下操作

$('#Button1, #Link1').click(function() {
    // You can use `this` to refer to the source element, for instance:
});

Answer 4

我想没有办法那样做

而是尝试在事件处理程序中使用相同的功能

$('#formId').submit(function{
   execute();
});

 $('#design_next_step').click(function{
 execute();
 })

Answer 5

这样会更合适。

$('.anchor').click(function{
   $('form').submit();
});

Answer 6

可能你可以像调用普通函数一样调用它。由于在这种情况下提交和单击执行相同的操作，当用户提交或单击链接时，他们调用函数“myFunction”

                function myFunction()
                      {
                        ..........
                      }
                $('#button').submit(myFunction);
                $('#link').click(myFunction);

或者

                 var myFunction=function()
                    {
                       .......
                    }

                  $('#button').submit(myFunction);
                  $('#link').click(myFunction);