How to run a code on double-click event in jQuery ?

Last Updated : 17 Mar, 2021

In this article, we will see how to run a code after double clicked the element using jQuery. To run the code on double clicked we use dblclick() method. This method is used to trigger the double-click event to occur. This method occurs when the selected element will be double clicked.

Syntax:

$(selector).dblclick(args);

Parameter: It accepts an optional parameter “args” which specifies a function that do a specific task after double clicking.

Example:

HTML

<!DOCTYpe html> 
<html> 
  
<head> 
    <title> 
        How to run a code on double-click 
        event in jQuery? 
    </title> 
  
    <script src= 
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> 
    </script> 
  
    <!-- jQuery code to show the working  
        of this method -->
    <script> 
        $(document).ready(function () { 
            $("body").css("text-align", "center"); 
            $("h1").css("color", "green"); 
            $("p").dblclick(function () { 
                $(this).css("font-size", "20px"); 
                $(this).css("color", "green"); 
            }); 
        }); 
    </script> 
</head> 
  
<body> 
    <h1>GeeksforGeeks</h1> 
  
    <h3> 
        How to run a code on double-click 
        event in jQuery? 
    </h3> 
  
    <p> 
        GeeksforGeeks: A computer science portal 
    </p> 
  
</body> 
  
</html>