1

内容をクリアしたdivがあり、その場所に新しいものを配置したい場合、これらの関数を文字列化して、前の関数が完了した後にのみ起動するようにするにはどうすればよいですか？

$('#nner_container').fadeOut(300, function(){

    $('#header_div').after('<div id="inner_container" style="dispay:none"></div>');
       //when this insertion of inner_container completes, fill it with some content
       //and when that completes, fadeIn inner_container

});

ほとんどのjquery関数は、最終的なパラメーターとして追加の関数を使用しているようです。これはまさにこの目的で使用されたと思います。しかし、そうではありませんafter()。または私は何か間違ったことをしていますか？

ありがとう

4

3 に答える 3

3

新しい div を追加したら、フェード インしますinner_container。

$('#inner_container').fadeOut(300, function(){

    $('#header_div').after('<div id="inner_container" style="dispay:none"></div>');
    $('#inner_container').fadeIn(300);
});

このafter関数は同期的です。つまり、前のステートメントが完了するまで次のステートメントは実行されません。

一方、fadeOutandfadeInは非同期で実行されます。つまり、エフェクトが完了する前に次のステートメントが実行される可能性があります。これが、効果が完了したときに関数fadeOutと関数がコールバックを実行する必要がある理由です。fadeIn

于 2012-08-29T18:44:03.010 に答える
1

コンテンツを置き換える場合は、.replaceWith() 関数を試してください

于 2012-08-29T18:44:16.930 に答える
0

すぐに完了し、コールバックを必要としない (または持っていない)ため.after、次にやりたいことを次の行に置くだけでチェーンできます。

$('#inner_container').fadeOut(300, function(){    
    $('#header_div').after('<div id="inner_container" style="dispay:none"></div>');
    $('#inner_container').fadeIn(300);
});

非同期メソッドは通常、この場合のようにFadeIn時間FadeOutがかかり、完了するまでに一定の時間が必要なメソッドです。アニメーションではない DOM 操作関数のすべてではないにしても、ほとんどは実際には同期的であり、コールバックなしで従来のコードとしてコーディングできます。

于 2012-08-29T18:44:36.210 に答える