jQuery | triggerHandler() Method

The triggerHandler() Method in jQuery is used to trigger a specified event for the selected element.

Syntax:

$(selector).triggerHandler(event, param1, param2, ...)

Parameters: This method accepts two parameters as mentioned above and described below:

  • event: It is an mandatory parameter which is used to specify the event to trigger for the specified element.
  • param1, param2, … : These are an optional parameters which are used to pass on the event handler and these are especially useful with custom event.

Example 1: This example triggered the input select element.

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
  
<head
    <title>
        jQuery | triggerHandler() Method
    </title>
      
    <script src=
    </script>
</head
  
<body style = "text-align:center;">  
  
    <h1 style = "color:green;" >  
        GeeksForGeeks
    </h1>  
      
    <h2>jQuery | triggerHandler() Method</h2>
  
    <input type="text" value="HELLO GEEKS">
      
    <br><br>
      
    <button>Click</button>
      
    <!-- Script to trigger event -->
    <script>
        $(document).ready(function(){
            $("input").select(function(){
                $("input").after(" TRIGGERED!");
            });
            $("button").click(function(){
                $("input").triggerHandler("select");
            });
        });
    </script>
</body>  
  
</html>

chevron_right


Output:

Example 2: This example trigger the paragraph event and display the alert message.

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
  
<head
    <title>
        jQuery | triggerHandler() Method
    </title>
    <script src=
    </script>
</head
  
<body style = "text-align:center;">  
  
    <h1 style = "color:green;" >  
        GeeksForGeeks
    </h1>  
      
    <h2>jQuery | triggerHandler() Method</h2>
  
    <button>Click</button>
      
    <!-- Script to trigger events -->
    <script>
        $(document).ready(function() {
            $("button").click(function() {
                $("button").on("myPara", function(event, 
                                param1, param2, param3) {
                    alert(param1 + "\n" + param2 + "\n" + param3);
                });
                  
                $("button").triggerHandler("myPara",
                            ['GEEKS', 'FOR', 'GEEKS']);
            });
        });
    </script>
</body>
  
</html>  

chevron_right


Output:



My Personal Notes arrow_drop_up

Recommended Posts:



    Article Tags :

    Be the First to upvote.


    Please write to us at contribute@geeksforgeeks.org to report any issue with the above content.