javascript - jQueryの選択可能がこのクリック機能を壊すのはなぜですか?

Question

シンプルな dblClick 関数が機能しています。jQuery UI を使用してキャンバス div を選択可能にする必要がありますが、そうすると dblClick 関数が壊れます。

HTML

<div id="canvas">
    <div class="trigger">Click me</div>
    <div class="box"></div>
</div>

Javascript

$('#canvas').selectable();

$('.trigger').dblclick(function() {
    $('.box').toggleClass('active');
});

score 1 · Accepted Answer

これは、単一の DOM 要素に対するとの非互換性について議論している同様の投稿であり、ここでも同様のことが起こっていると思われます。イベントをキャンセルすると、ダブルクリックを取り戻すことができます:.selectable().dblclick().ui-selected

$('#canvas').selectable({ 
   cancel: '.ui-selected' 
});

これは、ダブルクリックが機能していることを示す新しい Fiddleです。

score -2 · Accepted Answer

ここで私は修正しました、それは今動作します。キャンバスを選択可能にしている理由がわかりません。

選択可能なクラスを削除し、.on イベントを追加しました。

$('.trigger').on('dblclick',function() {
    $('.box').toggleClass('active');
});

上記のコードで試してみてください。キャンバスに対して selectable() を実行している理由を説明してください。

3 に答える 3