If you're seeing this message, it means we're having trouble loading external resources on our website.

If you're behind a web filter, please make sure that the domains *.kastatic.org and *.kasandbox.org are unblocked.

Main content

What DOM events and properties are there?

Browsers trigger many events. You can use jQuery to add event listeners for any of those events.
A full list of browser events is on MDN, but here are some of the most common event types and names, plus examples of using them:
  • mouse events: 'click' (example), 'mousedown'/'mouseup' (example), 'mousemove' (example), 'mouseenter'/'mouseleave' (example)
  • keyboard events: 'keydown', 'keypress', 'keyup' (example)
  • touch events: 'touchdown', 'touchup', 'touchstart', ‘touchcancel’ (example)
  • drag events: 'dragstart', 'dragend' (Many developers use jQueryUI for drag functionality, as it can be tricky to use the drag events directly. Here are examples of draggable elements and drop zones.)
  • form events: 'submit' (example), 'change' (example), 'focus'/'blur' (example).
  • window events: 'scroll' (example), 'reload', 'hashchange'
When you add an event listener and the event happens, jQuery will call your code back with a jQuery event object that has relevant properties on it. Read the documentation to learn more about what properties are available.

Want to join the conversation?