5

既存のdivコンテナにクラスを追加し、既存のdivコンテナの下に(成功した場合は)新しいdivを挿入しようとしています。

<script>
$(document).ready(function(){
  $(".entry").click(function(){
     $('#content').addClass("col2",1000).after('<div class="box col2">test</div>', function(){
        $(this).slideDown();
     });
  });
});
<script>

残念ながら、このコードは正しく機能しません。スライドダウン関数は機能せず、前の関数がまだ終了していなくても、新しいdivはすでに表示されています。

誰かが私を助けてくれたらいいのにと思います。

4

3 に答える 3

4

終了タグは</script>

また、必要な効果は次のとおりです。

$(".entry").click(function() {
    $('#content').addClass("col2").after('<div class="box col2">test</div>');
    $('.box:last').hide().show(300);
});

ここでフィドル


編集:あなたのコメントに基づいて、私はおそらくあなたがこれを望んでいると思います:

$(".entry").click(function() {
    $('#content').addClass("col2");
    setTimeout(function() {
        $('#content').after('<div class="box col2">test</div>');
        $('.box:last').hide().show(300);
    }, 500);
});

ここでフィドル

于 2011-10-11T22:24:08.713 に答える
1

after()コールバックを取りません。

代わりに、新しい要素の新しいjQueryオブジェクトを作成し、それを呼び出しslideDown()て、に渡す必要がありafter()ます。
例えば:

$(...).after(
     $('<div class="box col2">test</div>').slideDown()
);

明らかに、これはslideDown()実際に機能する要素に対してのみ機能します。

于 2011-10-11T22:20:01.963 に答える
0
$(document).ready(function(){
  $(".entry").click(function(){
     $('#content').addClass("col2").after('<div class="box col2">test</div>').slideDown();
  });
});

これでうまくいくはずです。.addClass()1つの入力のみを.after()受け取り、コールバック関数を受け入れません。.slideDown()ただし、上記の例では、関数が呼び出される前にクラスが追加され、htmlが追加されます。

いくつかのドキュメントリンク:

于 2011-10-11T22:20:58.607 に答える