1

私はjQueryの次の行を持っています:

// When dragging ends
stop: function(event, ui) {
    // Replace the placeholder with the original
    $placeholder.after( $this.show() ).remove();
    // Run a custom stop function specitifed in the settings
    settings.stop.apply(this);
},

settings.stop.apply(this);上記の行が ( $placeholder.after( $this.show() ).remove();) になるまで実行したくありませんsettings.stop。

jQuery を使用して、最初の行が完了するまで先に進まないようにこれらの 2 つの行を順序付けるにはどうすればよいですか?

4

2 に答える 2

1

アニメーションは非同期で発生するため$this.show()、行の前に完了しませんsettings.stop.apply...。すべてのアニメーションは、デフォルト (「fx」) キューに入れられ、順番に再生されます。関数を使用して、queueこのシーケンスに (アニメーションでなくても) 何かを追加できます。したがって、例を適応させるには：

// When dragging ends
stop: function(event, ui) {
    // Replace the placeholder with the original
    $placeholder.after( $this.show() ).remove();
    // Run a custom stop function specitifed in the settings
    var x = this;   //make sure we're talking about the right "this"
    $this.queue(function() {
        settings.stop.apply(x);
        $(this).dequeue();    //ensure anything else in the queue keeps working
    });
},

あなたのコメントに応じて編集してください「正しい「これ」とはどういう意味ですか?」:

JavaScript では、参照元のスコープに応じて変化thisするトリッキーな獣になる可能性があります。queue関数に渡されるコールバックではthis、queueが実行されている DOM オブジェクト (つまり、 によって参照される DOM オブジェクト) を参照し$thisます。ただし、this外側のstop関数内の が他のオブジェクトを参照している可能性は十分にあります...

さて、あなたの例では、 jQueryオブジェクトthisによって表されるDOMオブジェクトへの外部参照である可能性があります（つまり、おそらくこのスニペットが取得された場所の上のどこかにあるでしょう）。この場合、 2 つの は同じであるため、 は不要です。でも、わからないので、確かめてみようと思いました。そこで、「右」を参照する新しい変数 を作成してクロージャ* を作成しました(はクロージャに含まれるようになったため、コールバック内の正しいものを参照していることがわかります)。$thisvar $this = $(this);xthisxthisxqueue

* ちょっと面倒ですが、最後にリンクされた記事を読み進めれば、javascript がどのように連携しているかをよく理解できます。

于 2010-05-24T04:47:36.713 に答える
1

アニメーションの最後まで待機する別の方法は、コールバックを使用することです。

stop: function(event, ui) {
     $placeholder.after( $(this).show('fast', 
                           function() { // called when show is done
                              $placeholder.remove(); // var still accessable
                              settings.stop.apply(this);
                            });
                       );
于 2010-05-24T05:13:34.003 に答える