Skip to content
Related Articles

Related Articles

Improve Article
How to display a message on dblclick event on all paragraphs of a page using jQuery ?
  • Last Updated : 23 Apr, 2021

The purpose of this article is to display a message to the double click event on all paragraphs on a page. Whenever you double-click on any of the paragraphs then the message will appear.

Used method in jQuery: 

dblclick(): This method is used to trigger the dblclick event, or attaches a function to run when a double click event occurs.

Syntax:

$(selector).dblclick(optional_function);

 



Approach:

  • First, create the HTML page with some paragraph elements.
  • Using the above syntax to display a message after the trigger of double-click event.

Example:

HTML




<!DOCTYPE html>
<html>
  
<head>
    <script src=
    </script>
  
    <style>
        body {
            text-align: center;
            font-size: 30px;
        }
    </style>
  
    <script>
        $(document).ready(function () {
            $("p").dblclick(function () {
                $("#result").show().html(
                    "The paragraph was double-clicked");
            });
        });
    </script>
  
  
</head>
  
<body>
    <h2 style="color:green">GeeksforGeeks</h2>
  
    <p>
        Double-Click on this paragraph 
        to see the result.
    </p>
  
    <p>Second paragraph</p>
    <span>This is span</span>
  
    <p>Third paragraph</p>
  
    <div style="height:10px;"></div>
    <div id="result"></div>
</body>
  
</html>

Output:




My Personal Notes arrow_drop_up
Recommended Articles
Page :