Detectar click y doble click en HTML

publicado por: Anonymous

Como puedo hacer para detectar si se ha hecho un click simple o un doble click sobre un elemento HTML <div> he probado el siguiente código:

<div onclick="alert('un click')" ondblclick="alert('doble click')"> Click aqui</div>

El problema es que no me detecta el doble click, siempre me muestra el mensaje “un click”, como hago para detectar uno u otro.

solución

No es posible utilizar ambos eventos a la vez. Puedes hacer alguna especie de truco como el siguiente:

_x000D_

_x000D_

var DELAY = 700,_x000D_
    clicks = 0,_x000D_
    timer = null;_x000D_
_x000D_
$(document).ready(function() {_x000D_
_x000D_
    $("a")_x000D_
    .bind("click", function(e){_x000D_
_x000D_
        clicks++;  //count clicks_x000D_
_x000D_
        if(clicks === 1) {_x000D_
_x000D_
            timer = setTimeout(function() {_x000D_
_x000D_
                alert('Single Click'); //perform single-click action_x000D_
_x000D_
                clicks = 0;  //after action performed, reset counter_x000D_
_x000D_
            }, DELAY);_x000D_
_x000D_
        } else {_x000D_
_x000D_
            clearTimeout(timer);  //prevent single-click action_x000D_
_x000D_
            alert('Double Click');  //perform double-click action_x000D_
_x000D_
            clicks = 0;  //after action performed, reset counter_x000D_
        }_x000D_
_x000D_
    })_x000D_
    .bind("dblclick", function(e){_x000D_
        e.preventDefault();  //cancel system double-click event_x000D_
    });_x000D_
_x000D_
});

_x000D_

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>_x000D_
<a href="#">Click Me</a>

_x000D_

_x000D_

_x000D_

Aunque no entiendo para que quieres hacer algo así.

Respondido por: Anonymous

Leave a Reply

Your email address will not be published. Required fields are marked *