Wednesday, January 29, 2014

jQuery Event Methods

Events

All the user actions on a HTML page to which the page can respond is called an Event.
There are several events that are supported by jQuery.
Some common DOM events are:
  1. click
  2. dbclick
  3. mouseenter
  4. mouseleave
  5. hover
  6. mouseup
  7. mousedown
  8. keypress
  9. keyup
  10. keydown
  11. submit
  12. blur
  13. change 
  14. focus
  15. reload
  16. resize 
  17. unload
  18. scroll
Example:
In this example hide() and show() functions are used to hide a <p> element using two buttons one having  id=hide and other id=show. When you click the hide button the line hides.

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("#hide").click(function(){
    $("p").hide();
  });
  $("#show").click(function(){
    $("p").show();
  });
});
</script>
</head>
<body>
<p>If you click on the "Hide" button, I will disappear.</p>
<button id="hide">Hide</button>
<button id="show">Show</button>
</body>
</html>

No comments:

Post a Comment