Is there any difference between the following code?
$(\'#whatever\').on(\'click\', function() {
/* your code here */
});
and
As mentioned by the other answers:
$("#whatever").click(function(){ });
// is just a shortcut for
$("#whatever").on("click", function(){ })
Noting though that .on()
supports several other parameter combinations that .click()
doesn't, allowing it to handle event delegation (superceding .delegate()
and .live()
).
(And obviously there are other similar shortcut methods for "keyup", "focus", etc.)
The reason I'm posting an extra answer is to mention what happens if you call .click()
with no parameters:
$("#whatever").click();
// is a shortcut for
$("#whatever").trigger("click");
Noting that if you use .trigger()
directly you can also pass extra parameters or a jQuery event object, which you can't do with .click()
.
I also wanted to mention that if you look at the jQuery source code (in jquery-1.7.1.js) you'll see that internally the .click()
(or .keyup()
, etc.) function will actually call .on()
or .trigger()
. Obviously this means you can be assured that they really do have the same result, but it also means that using .click()
has a tiny bit more overhead - not anything to worry or even think about in most circumstances, but theoretically it might matter in extraordinary circumstances.
EDIT: Finally, note that .on()
allows you to bind several events to the same function in one line, e.g.:
$("#whatever").on("click keypress focus", function(){});