Evento ondblclick

El evento ondblclick se genera cuando el usuario hace doble clic en un elemento. Se dispara después de dos clickeventos.

El evento ondblclick se dispara cuando se presiona dos veces seguidas el botón izquierdo del mouse.

Sintaxis

target.ondblclick = functionRef;

Parámetros

  • functionRefes un nombre de función o una expresión de función . La función recibe un MouseEventobjeto como único argumento. Dentro de la función, thisestará el elemento sobre el que se desencadenó el evento.

Solo se ondblclick puede asignar un controlador a un objeto a la vez. Es posible que prefiera utilizar el método EventTarget.addEventListener()  en su lugar, ya que es más flexible.

Para ver el funcionamiento de este evento crearemos un div en una coordenada absoluta y lo ocultaremos al hacer doble clic en su interior.

<!DOCTYPE html>
<html>
<head>
<title>Problema</title>
<script >
function ocultar(objeto)
{
  objeto.style.display='none';
}
</script>
<style>
#recuadro {
  color:#aa0;
  background-color:#ff0;
  position:absolute;
  text-align:center;
  left:40px;
  top:30px;
  width:800px;
  height:70px;
}
</style>
</head>
<body>
<div id="recuadro" ondblclick="ocultar(this)">
<h1>Doble clic para ocultar este recuadro</h1>
</div>
</body>
</html>

La hoja de Estilo

#recuadro {
  color:#aa0;
  background-color:#ff0;
  position:absolute;
  text-align:center;
  left:40px;
  top:30px;
  width:800px;
  height:70px;
}

El código javascript

function ocultar(objeto)
{
  objeto.style.display='none';
}

Para ocultar el div accedemos a la propiedad display y le asignamos el valor none.