jQuery .mousedown() Method — Deprecated Shorthand

What Is the .mousedown() Method?

.mousedown() is a shorthand for binding or triggering the mousedown event (button press). With a handler it binds; with no arguments it triggers. Prefer .on / .trigger in new code.

$("#box").mousedown(fn)           // bind (deprecated)
$("#box").mousedown(data, fn)     // bind + eventData (deprecated)
$("#box").mousedown()             // trigger (prefer .trigger)

// Modern:
$("#box").on("mousedown", fn)
$("#box").trigger("mousedown")

How to Use .mousedown()

Know the three signatures, then map them to the modern API.

1. Select element(s): $("#box").
2. Bind (legacy): .mousedown(function (event) { ... }).
3. Optional data (1.4.3+): .mousedown({ key: "v" }, handler) → event.data.
4. Trigger (legacy): .mousedown() with no args — or use .trigger("mousedown").

Pseudocode

function mousedown(element, handler?):
    if handler given:
        bind "mousedown" → handler   // like .on("mousedown", handler)
    else:
        trigger "mousedown"          // like .trigger("mousedown")

// Prefer naming the event explicitly with on / trigger

Cheat Sheet

Quick map from shorthand to modern calls.

Live Preview

Run presets that show bind, eventData, and no-arg trigger via .mousedown().

Handler ran via .mousedown(fn).

jQuery Examples

Short snippets for legacy .mousedown(). Prefer the modern forms in new work — use Try It Yourself to experiment.

$("#target").mousedown(function () {
  console.log("Handler ran via .mousedown(fn).");
});

Handler ran via .mousedown(fn).

$(".pad").mousedown({ mode: "drag" }, function (event) {
  console.log("mode:", event.data.mode);
  console.log("id:", $(this).data("id"));
});

mode: drag
id: box

$("#target").mousedown(function () {
  console.log("Handler for mousedown called.");
});

$("#fire").click(function () {
  $("#target").mousedown();  // same idea as .trigger("mousedown")
});

Handler for mousedown called.

// Legacy
$("#legacy").mousedown(function () {
  console.log("via .mousedown(fn)");
});

// Modern (use this)
$("#modern").on("mousedown", function () {
  console.log("via .on(\"mousedown\", fn)");
});

via .on("mousedown", fn)

Performance Notes

Switching to .on / .trigger does not slow you down — it clarifies intent and unlocks delegation.

Key Takeaways