0

ユーザーが行を選択してjqueryグリッドの外にドロップしたときにイベントを取得しようとしています。これは、グリッド内でドラッグ/ドロップが発生するためのドロップ機能であり、完全に正常に機能します - 

    $(".grid-canvas")
        .on("drop", function (e, dd) {
              // somecode
                    });

グリッド キャンバス div の外で「どこでも」発生するドラッグ アンド ドロップを追跡しようとしています。しかし、逆選択は機能していないようです。私はこれを試しましたが、うまくいきません -

$(".grid-canvas")
    .not(this)
    .on("drop", function (e, dd) {
     alert("outside");
 });

私はこれを試しましたが、グリッド内のドラッグ＆ドロップでもトリガーされます-

$(":not(.grid-canvas)")
                               .on("drop", function (e, dd) {
                                alert("outside");
                            });

どんな助けでも感謝します。ありがとう。

4

2 に答える 2

0

まず、「on」のドキュメントを読んで理解を深めてください。2番目の例は次のように言っています：

Select all elements with the "grid-canvas" class
  ...that aren't `this`
  ...and watch for drop events on them, and do this when they happen

これは明らかにあなたが望むものではありません。2番目は近いです：

Select all elements that don't have a grid-canvas class
  ...and watch for drop events on them, and do this when they happen

どちらがより近いですが、a) ページ内のほぼすべての要素にイベント リスナーを追加しますが、これは非常に悪い考えです。あなたはまだリスナーをそれらにアタッチしました。

おそらくやりたいことはこれです：

Select a high-level element (e.g. `body`)
  ...listen for a drop event, and check if the drop event happened on .grid-canvas or one of its children

次のようになります。

$('body').on('drop', function(evt) {
  //Check if the element dropped on has a .grid-canvas as a parent
  if($(evt.target).parents('.grid-canvas').length == 0) {
    alert('Outside');
  }
}

ターゲットが .grid-canvas 内にあるかどうかを確認する方法はいくつかありますが、私が使用したのは単なる例です。$('.grid-canvas').has(evt.target)たとえば、逆から考えることもできます。これは、考え方によってはより理にかなっているかもしれません。

しかし全体としては、jQuery は英語ではありません。また、必要なことを実行するように聞こえるコマンドを単に並べることはできません。使用している関数を読み、その機能を理解するようにしてください。そうすれば、jQuery のスキルをより迅速に構築できます。

于 2013-08-12T22:43:02.330 に答える