18

clickdiv を挿入してからmousedown、その div をドラッグするために使用している特定のシナリオがあります。clickを親コンテナにバインドし、をmousedowndiv 自体にバインドしました。しかしmousedown、div を使用すると、親のクリックも発生するため、既に追加されている div をドラッグする代わりに、複数の div を挿入します!

この問題を解決する方法はありますか? clickを使用して 2 つの div を追加し、これらclickにバインドする必要があるため、バインドを解除できませんmousedown。

更新:selector.on(event, handler)タイプのバインディングを使用しています。

4

4 に答える 4

20

この方法を試してください。event.stopPropagationマウスダウン後にクリックイベントの発生を停止しません。マウスダウンイベントとクリックイベントは相互に関連していません。

var mousedownFired = false;

$("#id").on('mousedown', function(event) {
    mousedownFired = true;
    //code
});

$("#id").on('click', function(event) {
    if (mousedownFired) {
        mousedownFired = false;
        return;
    }
    //code
});

アップデート：

マウスイベントは次のようにトリガーされます。

  1. マウスダウン

  2. クリック

  3. マウスアップ

mousedownがトリガーされると、mousedownFired変数はに設定されtrueます。次に、クリックイベントで、クリックイベントのreturn処理を続行せず（つまり、クリックイベントの処理を続行せず）、mousedownFired変数がfalseにリセットされるため、今後のクリックイベントは正常に発生します。2回のマウスダウンまたは2回のクリックイベントは考慮しません。

于 2013-01-31T04:59:13.663 に答える
4

おそらくやりたいことは、個々の子 div ではなく、親コンテナーにイベント ハンドラーをアタッチすることです。これにより、新しい子が作成されるときに、イベント ハンドラーを追加する必要がなくなります。

例えば：

$("#parentDiv").on('click','.childDiv',function() {
    event.stopPropagation();
}).on('mousedown','.childDiv',function() {
    // your dragging code
});

.on() 関数にセレクターを提供すると、渡された関数は、そのセレクターに一致する子孫に対して呼び出されます。

于 2013-01-31T05:05:29.867 に答える
1

event.stopPropagation() を使用できます。

例 ：

$("#button").mousedown(function(event){
event.stopPropagation();
// your code here
});

$("#button").click(function(event){
event.stopPropagation();
// your code here
});

このページを見てくださいhttp://api.jquery.com/event.stopPropagation/

于 2013-01-31T04:32:46.190 に答える