Brandon Aaron

Bind Multiple Events Simultaneously with jQuery

Tuesday, June 5, 2007

It is sometimes necessary to bind two or more events to an element that utilize the same function. Using jQuery it might look something like this (where ‘fn’ is a function reference).

$("a")
    .bind("focus", fn)
    .bind("mouseover", fn);

That isn’t terrible but it would be nice if we could write it like this.

$("a").bind("focus mouseover", fn);

Well, now we can! I just checked in an extension to the jQuery plugins repository that adds this functionality. It is pretty small and if you use this pattern often, then save yourself some typing and get this extension! You can grab the source code from SVN or from here. You can find a test/example page here. This new syntax also applies to the one and unbind methods as well.

Posted in jQuery with 3 comments