双击extjs时如何防止触发单击事件

Question

我有一个树面板,每个节点我都有单击和双击事件.但是,当我双击时,它也会触发单击事件.那么如何防止双击时触发单击事件？

Answer 1

一般采用两种单单击和双击事件被认为是不好的做法,并高度气馁.

但是,如果您仍然想要这样做,那么能够区分单击和双击的唯一方法是通过测量点击之间的时间来人为地添加这种区别.

我们的想法是,您不要立即执行单击操作,而是等待第二次单击.如果第二次点击很快,则会触发双击操作.否则,您的单击操作会在延迟后触发.

您的代码将类似于:

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);

明显的缺点是:

• 单击操作会有延迟
• 在不同的操作系统中,触发双击的点击之间的间隔可以有不同的设置,因此硬编码的singleClickDelay不可靠
• JavaScript计时器不是100%准确,并且在具有不同性能的系统上结果可能不同

我不知道任何更好的解决方案,而且,我不鼓励您同时使用单击和双击,这通常会导致用户体验受损.