Code has been added to clipboard!

jQuery .mousedown(): Learn to Add Event Handlers to mousedown Events

Reading time 1 min
Published Jan 9, 2018
Updated Oct 10, 2019

jQuery mousedown: Main Tips

  • The method .mousedown() adds an event handler to the mousedown event, or triggers the event.
  • The mousedown event fires when the cursor is inside an element, and the mouse button is clicked.

Usage and Syntax of .mousedown()

The method jQuery .mousedown() attaches an event handler to run a function once the mousedown event occurs. It can also trigger the event.

In the example below, clicking on the paragraph makes additional text appear:

Example
$("div").mousedown(function() {
   $(this).after("<p style='color: blue;'>Mouse button pressed.</p>");
});

This syntax triggers the mousedown event:

$("selector").mousedown();

Follow this pattern to attach the event handler by adding the function:

$("selector").mousedown(function);

Note: the .mousedown() jQuery is a shortcut for jQuery .onmousedown(), the .on() method used with mousedown as the event parameter.

Learn jQuery
Introduction
Selectors
Events
Event Methods
Download
Callback
Chaining
Get and Set
Add Element
Remove Element
Traverse
Parent
Children
Sibling Traverse
Filtering
jQuery AJAX
Effects
Show and Hide
Fade Effect
Slide Effect
Animate Effect
Manipulate CSS
Width and Height
.addClass()
.after()
.animate()
.append()
.appendTo()
.attr()
.before()
.bind() (deprecated)
.blur()
.change()
.click()
.clone()
.css()
.dblclick()
.delay()
.delegate() and .undelegate() (deprecated)
.detach()
.empty()
.end()
.error() (deprecated)
.fadeIn()
.fadeOut()
.fadeTo()
.fadeToggle()
.finish()
.focus()
.focusIn()
.focusOut()
.hasClass()
.height()
.hide()
.hover()
.html()
.innerHeight()
.innerWidth()
.insertAfter()
.insertBefore()
.keypress()
.keyup()
.live() and .die() (deprecated)
.load() (deprecated)
.mousedown()
.mouseenter()
.mouseleave()
.mousemove()
.mouseout()
.mouseover()
.mouseup()
.off()
.offset()
.offsetParent()
.on()
.one()
.outerHeight()
.outerWidth()
.position()
.prepend()
.prependTo()
.prop()
.proxy()
.queue()
.ready()
.remove()
.removeAttr()
.removeClass()
.removeProp()
.replaceAll()
.replaceWith()
.resize()
.scroll()
.scrollLeft()
.scrollTop()
.show()
.slideDown()
.slideToggle()
.slideUp()
.stop()
.submit()
.text()
.toggle()
.toggleClass()
.trigger()
.triggerHandler()
.unbind() (deprecated)
.unload() (deprecated)
.unwrap()
.val()
.width()
.wrap()
Event Properties
event.currentTarget
event.preventDefault()
event.relatedTarget
event.stopImmediatePropagation()
event.stopPropagation()
event.target
event.timeStamp
event.type
event.which
jQuery .find()
jQuery .keydown()
jQuery.noConflict()
pageY and pageX