Home > DeveloperSection > Articles > JQuery Event function

JQuery Event function


JQuery JQuery 
Ratings:
0 Comment(s)
 4447  View(s)
Rate this:

JQuery Event function

JQuery Event handlers are method that is called whenever any event is generated or raised in HTML control. For example if I will click on the button then event will raise and all <label> element will hide from page.

JQuery events:

$(document).ready(function(){})

This event raise one time html loading has finished.

$(document).click(function())

This event when raise if any element click like button.

$(document).focus(function())

This event when raise if any element is selected

$( selector).dblclick(function())

This event when raise if any element double click like button.

$(selector).mouseover(function())

This event when raise if mouse pointer over on element

Code:

<head runat="server">

    <title></title>

 

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

 

    <script type="text/javascript">

        $(document).ready(function()

         {

             $("button").click(function()//click method will execute when button is clicked

             {

                $("label").hide();//label element will hide from page

            });

        });

    </script>

 

</head>

<body>

    <h2>

        Information</h2>

    Name--><label>

        Tom</label>

    <br />

    <br />

    Age--><label>

        23</label>    <br />

    <br />

    City--><label>

        Newyork</label>

    <br />

    <br />

    School--><label>

        St.Thomas</label>

    <br />

    <br />

    <button>

        Clear</button></body>

</html>

All label will be visible on the page  as shown below:

JQuery Event function

If I click on the clear button all label will hide from page as shown below:

JQuery Event function


Don't want to miss updates? Please click the below button!

Follow MindStick