Events and handlers for input form fields in JavaScript

Events and handlers for input form fields in JavaScript

Inputs in javascript have:

  • onfocus - change background or borders upon focusing: document.querySelector("input").onfocus
  • onblur - run validation of entered data upon losing focus: document.querySelector("input").onblur
  • onchange - upon changing the input value, it will only trigger after we remove focus from the element: document.querySelector("input").onchange
  • onkeydown - upon pressing a keyboard key, triggers immediately;
  • onkeyup - upon releasing a keyboard key;
  • onkeypress - only after pressing and then releasing;
  • onmousedown - after pressing the left mouse button;
  • onmouseup - after releasing the left mouse button;
  • onclick - triggers on mouse click;
  • ondblclick - after double clicking the left mouse button;
  • oncontextmenu - after pressing and releasing the right mouse button;
  • onmousemove - triggers on any mouse movement (used for drag'n'drop);
  • onmousedown - take an object - change the element coordinates (set new coordinates from the first argument of the event).