two different elements' submit and click events handled by same jquery function?

Question

I have a submit button #next_step and a link #design_next_step.

When the button submitted or the link is clicked, the same function is triggered.

How can I do something like this?

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

Answer 1

You can use the standard CSS comma to define a group selector:

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

When the button submitted or the link is clicked...

But buttons aren't submitted, they're clicked. The submit event relates to form elements, not button or input elements. Assuming that the ids you've shown there are for elements that are buttons or links, just use the click event:

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

Depending on what you're doing, you may — or may not — want to prevent the default action for the event [by accepting the event argument and calling preventDefault on it, or by doing return false in the handler which will both prevent the default and stop propagation]. The default action for click on links is to follow the link, for instance.

Answer 2

Just make both event handlers to call the same function F.

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