Cómo evitar que se active el evento de un solo clic al hacer doble clic en extjs

Question

Tengo un panel de árbol y para cada nodo tengo eventos de un solo clic y doble clic. pero cuando hago doble clic, también se activa el evento de un solo clic. Entonces, ¿cómo evitar disparar un solo clic al hacer doble clic?

Answer 1

En general, utilizar ambos eventos de un solo clic y doble clic se considera una mala práctica y altamente desaconsejado.

Sin embargo, si aún desea hacer esto, la única manera de poder distinguir entre un solo clic y doble clic es agregar artificialmente esta distinción midiendo el tiempo entre clics.

La idea es que no haga su acción de un solo clic de inmediato, sino que espere un segundo clic. Si aparece un segundo clic en breve, se activa su acción de doble clic. De lo contrario, su acción de un solo clic se activará después de la demora.

Su código será algo como:

var singleClickTask = new Ext.util.DelayedTask(singleClickAction), // our delayed task for single click 
    singleClickDelay = 100; // delay in milliseconds 

function onClick() { 
    singleClickTask.delay(singleClickDelay); 
} 

function onDblClick() { 
    // double click detected - trigger double click action 
    doubleClickAction(); 
    // and don't forget to cancel single click task! 
    singleClickTask.cancel(); 
} 

function singleClickAction() { 
    // something useful... 
} 

function doubleClickAction() { 
    // something useful... 
} 


// setting event handlers on an Element 
elem.on('click', onClick); 
elem.on('dblclick', onDblClick); 

Las desventajas obvias son:

• Hay un retraso de una sola acción de clic
• En diferentes sistemas operativos que no puede haber una configuración diferente para el intervalo entre clics que activaría un doble clic, por lo que el código simple de SingleClickDelay no es confiable
• El temporizador de JavaScript no es 100% exacto y los resultados pueden diferir en sistemas con un rendimiento diferente

No sé cualquier solución mejor, y otra vez, desalentar el uso de clics individuales y dobles, al mismo tiempo, esto por lo general conduce a una experiencia de usuario rota .

Answer 2

Creo que es mejor realizar la acción en el primer clic en lugar de en el segundo. Puede hacer esto configurando un valor booleano que verifique en cada evento de clic.

Este código demostró un enfoque

onGridRowClick: function(view, record, item, index, e, eOpts) { 
    if (record._task_in_progress) { 
     return; 
    } 
    // Let the second click as part of the double click to be ignored 
    record._task_in_progress = true; 

    // Emulating async task here 
    setTimeout(function() { 
     record._task_in_progress = false; 
    }, 1000); 
}