Difference between mousedown and click in jquery

Question

I am learning events in jquery. While implementing them i came across a doubt. What is the difference between mousedown() and click() event. And which event should i use at what condition.?

For example: Both the events perform the same task in the below code:

$("#p1").mousedown(function(){   alert("Mouse down over p1!"); });   $("#p1").click(function(){   alert("Mouse down over p1!"); }); 

Both perform the same.Can someone clarify the difference. If same, which should i prefer?.

Answer 1

onMouseDown will trigger when either the left or right (or middle) is pressed. Similarly, onMouseUp will trigger when any button is released. onMouseDown will trigger even when the mouse is clicked on the object then moved off of it, while onMouseUp will trigger if you click and hold the button elsewhere, then release it above the object.

onClick will only trigger when the left mouse button is pressed and released on the same object. In case you care about order, if the same object has all 3 events set, it's onMouseDown, onMouseUp, then onClick. Each even should only trigger once though.

Details:

http://api.jquery.com/click/
http://api.jquery.com/mouseup/
http://api.jquery.com/mousedown/

Source written by Anton Baksheiev

Answer 2

A mousedown event is fired when the mouse button is pressed but before it is released.

The click event is fired after the mousedown and mouseup events.