HTML ondblclick Event Attribute

If this site has been useful, we’d love your support! Running this site takes time and resources, and every small contribution helps us keep creating valuable content. Consider buying us a coffee to keep things going strong!

☕ Buy a Coffee

Description

The ondblclick HTML event attribute specifies a JavaScript function to be executed when the user double-clicks on the element. It is part of the Event Attributes family, which can be used on any HTML element.

The ondblclick event fires after two click events, and by extension, after two pairs of mousedown and mouseup events. This means that the user must click on the element twice within a very short span of time in order for the ondblclick event to fire.

The ondblclick event can be used to perform a variety of actions, such as opening a new window, submitting a form, or playing a video. It is a common way to implement features such as image editing, text selection, and file dragging.

Here is an example of how to use the ondblclick event attribute:

<p ondblclick="alert('You double-clicked me!')">
  Double-click me!
</p>

When the user double-clicks on the <p> element, the alert() function will be called, displaying a message box with the text "You double-clicked me!".

Syntax

<element ondblclick="script">

Values

scriptThe name of the script to use when the event has been triggered.

Example

HTML

<!DOCTYPE html> 

  <html> 

  <head>

    <title>Event attribute ondblclick</title> 

  </head> 

  <body> 

    <p id="demo2">Double-click on the button to run the script:</p> 

    <button ondblclick="mouseTest2()">Double click on me!</button> 

<script> 

  function mouseTest2 () { 

  var x = document.getElementById ("demo2"); 

  x.style.fontSize = "25px";  

  x.style.color = "orange";  

  x.style.backgroundColor = "#555555"; 

} 

</script> 

  </body> 

</html>