jQuery Event

By ukmodak | April 29th 2021 06:09:07 AM | viewed 80 times

jQuery Event

All the different visitors' actions that a web page can respond to are called events.

The folowing are different type events:

Mouse Events

  1. click()
  2. on()
  3. dblclick()
  4. mouseenter()
  5. mouseleave()
  6. mousedown()
  7. mousemove()
  8. mouseout()
  9. mouseover()
  10. mouseup()
  11. .contextmenu()
  12. hover()
  13. toggle()

Keyboard Events

  1. keypress()
  2. keydown()
  3. keyup()

Form Events

  1. submit()
  2. change()
  3. focus()
  4. blur()
  5. focusin()
  6. focusout()
  7. select()

Document/Window Events

  1. load()
  2. resize()
  3. scroll()
  4. unload()

Example

$("p").on("click", function(){
  $(this).hide();
});
$("p").on({
  mouseenter: function(){
    $(this).css("background-color", "lightgray");
  },
  mouseleave: function(){
    $(this).css("background-color", "lightblue");
  },
  click: function(){
    $(this).css("background-color", "yellow");
  }
}); 

$("input").blur(function(){
  $(this).css("background-color", "#ffffff");
});
bONEandALL