Skip to content
Related Articles

Related Articles

Improve Article
Save Article
Like Article

jQuery | event.stopPropagation() Method

  • Last Updated : 17 Jul, 2019

The event.stopPropagation() method is an inbuilt method in jQuery which is used to stop the windows propagation. In the DOM tree when setting an event with the child element and the parent element as well then if you hit on the child element event it will call both child and the parent element as well. So with the help of this method this popup will not appear for the other element except selected element.

Syntax:

event.stopPropagation()

Parameters: It accepts single parameter which is mandatory. This parameter comes from binding function.

Return Value: This method returns the selected element with specified changes made by stopPropagation() method.

Example: This example illustrates the event.stopPropagation() method.




<!DOCTYPE html>
<html>
   
<head>
    <title>
        jQuery event.stopPropagation() Method
    </title>
      
    <script src=
    </script>
      
    <style>
        .main {
            border:1px solid green;
            padding:20px;
            width:60%;
        }
    </style>
      
    <!-- Script to use jQuery event.stopPropagation() Method -->
    <script>
        $(document).ready(function() {
            $(".main").click(function() {
                alert("Main div element");
            });
            $(".GFG").click(function(event) {
                event.stopPropagation();
                alert("Nested div element");
            });
            $(".geeks").click(function(event) {
                alert("Second nested div element");
            });
        });
    </script>
</head>
   
<body>
      
    <!-- Click on element to display alert message -->
    <div class="main">
        GeeksforGeeks
        <div class="GFG">
            A computer science portal
            <div class="geeks">
                Welcome to GeeksforGeeks
            </div>
        </div>
    </div>
   
</body>
   
</html>

Output:

  • Before Clicking the button:
  • After Clicking the button:




My Personal Notes arrow_drop_up
Recommended Articles
Page :