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


  Modified On Nov-24-2017 05:41:41 AM

Leave Comment