jQuery Tutorial


jQuery Example


jQuery References


jQuery Events




JavaScript has its own ability to create interaction with Users. Events is a perform action in Dynamic WebPage.

We are create dynamic and responsive webpage using jQuery techniques to make more easy. jQuery syntax is very simple or more powerful.

What is the Event are perform in jQuery?

  • Mouse Click Event
  • Mouse Double Click Event
  • Submit a Post or Form
  • Mouse Hover on element
  • Some content Loading on Webpage where need to use by users etc..

juery Event Functions

In this example, event is occurs and function is called when the click button is triggered.

$("#btn2").click(function () {
Event Code...
.............
});

Example:

<html>
<head>
   <script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript"> 
$(document).ready(function(){
    $("#btn1").hide();
      $("p").hide();	
    $("#btn2").click(function () {
      $("p").show("slow");
	  $("#btn2").hide();
	  $("#btn1").show();
    }); 
    $("#btn1").click(function () {
      $("p").hide("slow");
    });
});	
</script>   
</head>

<body>

<button id="btn1">Click To Hide Paragraph</button>
<button id="btn2">Click To Show Paragraph</button>

  <p style="background-color:#99FFFF;font-size:16px;
  font-family:Verdana;">This Paragraph Will Be Hide After Click...</p> 

</body>
</html>
Online Try This Code Your Self....   »

Some jQuery Events Methods

Following some commonly use of event methods in jQuery:

Method Description
$(document).ready(function) Function is ready to perform action event on Document.
$(selector).focus(function) Function is focus on selected element with in Document.
$(selector).blur(function) Function is blur on selected element with in Document. (Focus Out)
$(selector).click(function) Function is click on selected element with in Document.
$(selector).dblclick(function) Function is Double click on selected element with in Document.
$(selector).mouseover(function) Function is mouseover on selected element with in Document.

Full Reference of jQuery Event References Learn all jQuery Events References.