Delegate In JQuery

jQuery Event delegate() Method

When a specific function to run then the events occurs. The delegate() attaches one or more event handlers for specified elements that are children of selected elements.

It is work in both current and FUTURE elements (new element created by a script) when event handler attached using the delegate().

Syntax

$(selector).delegate(childSelector,event,data,function)

 

Example

 

<!DOCTYPE html>

<html>

<head>

<script type="text/javascript" src="jquery.js"></script>

<script type="text/javascript">

    $(document).ready(function () {

        $("div").delegate("button", "click", function () {

            $("p").slideToggle();

        });

    });

</script>

</head>

<body>

<div style="background-color:Red">

<div style ="font-family :Gigi ">

<p>This is my first paragraph.</p>

</div>

<button>Click me</button>

</div>

</body>

</html>

 

Output


delegate method pic12.jpg

 

Note: In this output after click on the click me button paragraph <p> hide.

 

ParameterDescription
childSelectorRequired. It is define that one or more child element attach to the event handler
EventRequired. It is define that one or more event attached to the element.

And must be valid event, multiple event separated by space.

DataIt is define that additional data to pass along with the function.
functionRequired. It define that function to run when event occur.

You may also want to read these related articles Click here

Next Recommended Reading Show Another Image On Hover Using JQuery