How to use click() Method in jQuery

This article describe about click() Method in jQuery.
  • 1612

jQuery Event click() Method

When an element is clicked the click event of jQuery occurs.
The click() specifies a function to run when a click event occurs.

Example

!DOCTYPE html>

<html>

<head>

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

<script type="text/javascript">

    $(document).ready(function () {

        $("button").click(function () {

            $("p").slideToggle();

        });

    });

</script>

</head>

<body>

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

<button>Click me!</button>

</body>

</html>

Output

click event pic7.jpg

Note: After click on the button hide the paragraph element.

click event pic8.jpg

Trigger the click Event

Occur the trigger on the click event of selected element.

Example

<!DOCTYPE html>

<html>

<head>

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

<script type="text/javascript">

    $(document).ready(function () {

        $("button").click(function () {

            $("p").slideToggle();

        });

        $("p").dblclick(function () {

            $("button").click();

        });

    });

</script>

</head>

<body>

<button>Click to toggle</button>

<p>Also Double click this paragraph to trigger the click event for the button.</p>

</body>

</html>

Output

click event pic9.jpg

Bind a Function to the click Event

It is define the function that run when click event occur on the selected element.

Syntax

$(selector).click(function)

You may also want to read these related articles Click here

Ask Your Question 

Got a programming related question? You may want to post your question here

Programming Answers here

Categories

More Articles

© 2013 dotNetheaven. All rights reserved.