4

最近まで、私はこれを設定していました。これは複数回呼び出されました。

                $('.rsh')
                    .draggable('destroy')                               
                    .draggable({ blah blah details });

クラスに蓄積する複数のdestroyドラッグ可能なハンドラーを停止するためにありました。新しい要素はAJAXによって作成されてdraggableおり、クラスへの最初のアタッチメントは、その後に作成される要素には影響しません。

ただし、jQuery UIのバージョン1.9.2に更新すると、次のエラーが発生し始めました。

エラー：初期化の前にドラッグ可能なメソッドを呼び出すことはできません。メソッド「destroy」を呼び出そうとしました

だから私は破壊ラインを削除しました、そしてそれは甘いです。を除いて...私は今、クラスにますます多くのハンドラーを追加しているのではないかと思います（それがdestroyそもそもそこにあった理由です）。

私はこれを試しましたが、気に入らなかった：

if ($('.rsh').length) {
    $('.rsh').draggable('destroy'); 
}

2つの質問：（1）ドラッグ可能なセットアップラインを起動するたびに、クラスにアタッチされるハンドラーはますます増えますか？（2）もしそうなら、それらを削除する方法に関する解決策はありますか？

4

2 に答える 2

7

いいえ、余分なハンドラーはバインドされません。jQueryは初期化されたインスタンスを要素に登録し、同じ要素に対して同じウィジェットの新しいインスタンスを作成しません。

ハンドラーについて心配しているので、ここに簡単なチェックがあります（jQuery1.8以降およびUI1.9以降）：

$('div').draggable();
console.log( $._data($('div')[0], 'events') );
$('div').draggable();
console.log( $._data($('div')[0], 'events') );

フィドル

ご覧のとおり、同じ要素で新しいドラッグ可能なインスタンスを初期化しようとしても、アタッチされたハンドラーオブジェクトは変更されません。

編集：パラメータを使用した後続の呼び出しは無視されませんが、@JasonSperskeの回答に示されているように既存のウィジェットを拡張します。

于 2013-01-09T23:41:15.140 に答える
5

同じオブジェクトに接続されている場合に以前の呼び出しを拡張するための後続の呼び出し.draggable()（そして、私が最初に考えていたようにそれらを置き換えないでください）。この例を参照してください（FabrícioMattéから拡張）（デモ）

<div>foo</div>
<script>
 $('div').draggable({
  start: function () {
    console.log("drag 1");
  }
 });
 console.log($._data($('div')[0], 'events'));
 $('div').draggable({
  stop: function () {
    console.log("drag 2");
  }
 });
 console.log($._data($('div')[0], 'events'));
</script>

には、console.log次のメッセージのみが表示されます。

drag 1 <- on start
drag 2 <- on stop
于 2013-01-09T23:55:50.390 に答える