Bisogno di cancellare click / eventi MouseUp quando si fa doppio clic evento rilevato

Question

Come è questo fatto?

Answer 1

Questa è una buona domanda, e io in realtà non credo che può essere fatto facilmente. ( Alcuni discussione su questo )

Se è super duper importante per voi di avere questa funzionalità, si potrebbe incidere in questo modo:

function singleClick(e) {
    // do something, "this" will be the DOM element
}

function doubleClick(e) {
    // do something, "this" will be the DOM element
}

$(selector).click(function(e) {
    var that = this;
    setTimeout(function() {
        var dblclick = parseInt($(that).data('double'), 10);
        if (dblclick > 0) {
            $(that).data('double', dblclick-1);
        } else {
            singleClick.call(that, e);
        }
    }, 300);
}).dblclick(function(e) {
    $(this).data('double', 2);
    doubleClick.call(this, e);
});

E qui è un esempio al lavoro .

Come sottolineato nei commenti, v'è un plugin per questo che fa quello che ho fatto sopra più o meno, ma i pacchetti in su per voi in modo da non deve vedere il brutto: FixClick .

Answer 2

Raymond Chen ha discusso alcune delle implicazioni del di singolo-versus -double cliccando - anche se sta parlando nel contesto di Windows, quello che dice è rilevante per la progettazione dell'interfaccia utente basata su browser

.

In sostanza, l'azione intrapresa su un doppio click dovrebbe essere una cosa logica da fare dopo un solo clic. Così, per esempio, in un'interfaccia utente desktop, solo clic seleziona una voce, e fare doppio clic apre (ad esempio, apre il file, o avvia l'applicazione). L'utente dovrà selezionare il file per aprirlo comunque, quindi non importa che viene presa la singola azione click prima della doppia azione clic.

Se si dispone di un componente di interfaccia utente la cui azione click doppio è completamente estraneo alla singola azione click, in modo tale che si rende necessario per evitare che la singola azione click si verifichi una volta che il sistema si rende conto che era in realtà un doppio clic, allora si dovrebbe davvero di ripensare il vostro disegno. Gli utenti troveranno a disagio e contro-intuitivo, in quanto non si comporterà nel modo in cui vengono utilizzati per cose recitazione.

Se si vuole ancora andare in quel modo, allora si sia necessario utilizzare la tecnica debouncing (nel qual caso sarà ritardata tutte le singole azioni del mouse) oppure implementare un meccanismo per cui il gestore doppio click annulla il lavoro svolto dal click gestore unico.

Si dovrebbe anche essere consapevoli del fatto che alcuni utenti di impostare un tempo molto lungo doppio click. Qualcuno, ad esempio, le mani artritiche potrebbe avere un tempo doppio click su più di un secondo set nelle loro preferenze di sistema, per cui la tecnica debouncing sulla base di un certo periodo di tempo arbitrario di tua scelta sta per rendere il componente dell'interfaccia utente inaccessibile a quelle persone se prendendo la singola azione click preclude prendendo la doppia azione click. Il "disfare quello che è appena accaduto il singolo click" tecnica è l'unica soluzione praticabile per questo, per quanto ne so.

Answer 3

La tecnica descritta in altre risposte è noto come debouncing .

Answer 4

jQuery Sparkle fornisce una soluzione elegante pulita per questo, mediante l'attuazione di un evento personalizzato SingleClick. In questo modo, è possibile utilizzarlo come qualsiasi altro evento, in modo:

$('#el').singleclick(function(){});
// or event
$('#el').bind('singleclick', function(){});

Fornisce inoltre gli eventi personalizzati per gli ultimi e primi scatti di una serie di scatti. E l'evento personalizzato lastclick realtà supera la quantità di click indietro! Così si potrebbe fare questo!

$('#el').lastclick(function(event,clicks){
    if ( clicks === 3 ) alert('Tripple Click!');
});

È possibile trovare il codice sorgente per definire l'evento personalizzato qui .

E 'open source sotto la licenza AGPL, quindi si può sentire liberi di afferrare quello che ti serve fuori di esso senza preoccupazioni! :-) E 'anche attivamente sviluppato in un giorno per giorno in modo da non sarete mai a corto di supporto.

Ma soprattutto si tratta di un quadro DRY Plugin / Effetto per consentire di sviluppare plugin ed estensioni molto più facilmente. Quindi speriamo che questo aiuta a raggiungere questo obiettivo!

Answer 5

Se questo è per un pulsante la presentazione di una forma (che non è necessariamente il caso per il manifesto originale, ma può essere il caso per altre persone arrivare qui via Google), una scelta più facile sarebbe quella di disabilitare l'elemento che si sta cliccato nel vostro gestore di eventi click:

$(selector).click(function(e) {
    $(this).prop('disable', true);
}