Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Binding multiple events in jQuery

I have a custom jQuery plugin which binds a change event to a form element, in this case some input elements. The change event is used to indicate to some other components that a change has taken place.

This works as it should.

However, I've come across the need to bind an additional change event to the same input elements -- so that additional components can act on the event. I don't wish to replace the plugin's change, simply run an additional function afterwards.

Is there any way to bind multiple events in jQuery, or, what is the best method for accomplishing this?

like image 883
Lachlan McDonald Avatar asked Apr 18 '10 10:04

Lachlan McDonald


2 Answers

You can bind multiple handlers for the same event. Bind the second change as you normally would:

​<input type="text" id="a" />​​​​​​​​​​​​​​​

​$("#a"​).change(function() { alert("1"); });
$("#a").change(function() { alert("2"); });​

$("#a").change(); // alerts 1, then 2
like image 158
Anurag Avatar answered Oct 25 '22 05:10

Anurag


Events stack in jQuery. If you do:

<input type="button" value="Press me">

and:

$(":button").click(function() {
  alert("click");
}).click(function() {
  alert("click 2");
});

both will fire. So just bind another event to the relevant elements. It won't overwrite the first.

like image 43
cletus Avatar answered Oct 25 '22 06:10

cletus