extjsをダブルクリックしたときのシングルクリックイベントの発生を防ぐ方法

Question

私はツリーパネルを持っており、各ノードに対してシングルクリックとダブルクリックのイベントがあります。ダブルクリックするとシングルクリックイベントも発生します。どのようにダブルクリックしたときにシングルクリックイベントを発射するのを防ぐのですか？

Answer 1

通常、を使用しています。シングルクリックとダブルクリックのイベントは悪い習慣とみなされ、非常に推奨されません。

しかし、これをやりたければ、シングルクリックとダブルクリックを区別できる唯一の方法は、クリック間の時間を測定することによって人為的にこの差異を追加することです。

ワンクリックアクションをすぐには実行しないで、2回目のクリックを待つという考えがあります。まもなく2回目のクリックが来ると、ダブルクリックアクションが発生します。それ以外の場合、遅延後にクリック操作がトリガーされます。

はあなたのコードのようなものになります。

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

を明らかに欠点がある：

• 異なるOSでシングルクリックアクション
• のための遅延が異なる設定が可能がありますダブルクリックを引き起こすクリック間隔のため、ハードコーディングsingleClickDelayは信頼性がありません
• JavaScriptタイマーは100％正確ではありませんパフォーマンスの異なるシステムで結果が異なる可能性があります。

私はこれ以上の解決策を知らず、同時にシングルクリックとダブルクリックの両方を使用しないことをお勧めします。これは通常、ユーザーエクスペリエンスの崩壊につながります。

Answer 2

2番目のクリックイベントではなく、1番目のクリックイベントでアクションを実行する方がよいと思います。これを行うには、各クリックイベントをチェックするブール値を設定します。

このコードは、アプローチを実証

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