javascript - jQuery で「before」メソッドと「fadeIn」メソッドを組み合わせるにはどうすればよいですか?

Question

jQuery の before メソッドを使用して、既にページにある別の div の前に div を挿入する jquery の行があります。

$("#sendEmail").before('<div id="response"><h1>Success</h1><p>Your email was sent.</p></div>');

新しい div をフェードインさせたいので、2 つの異なる方法でメソッドを組み合わせようとしましたが、どちらも正しく機能しませんでした。これが私が試したものです：

$("#sendEmail").before('<div id="response"><h1>Success</h1><p>Your email was sent.</p></div>').fadeIn("slow");

#sendmail div をフェードアウトしようとしていて、私が挿入していたものではないため、うまくいきませんでした。これが私が行った他の試みです：

$("#sendEmail").before('<div id="response"><h1>Success</h1><p>Your email was sent.</p></div>');                             

$("#response").fadeIn("slow");

フェードインしようとすると #response div が既に挿入されているため、これも機能しませんでした。

とても近くにいるような気がしますが、わかりません。誰か助けてくれませんか？

Answer 1

$('<div id="response"><h1>Success</h1><p>Your email was sent.</p></div>')
    .hide().insertAfter("#sendemail").fadeIn();

Answer 2

追加の $() を追加してみてください。これにより、応答で createElement が呼び出され、フェードインされます。その後、sendEmail 要素の前に要素が追加されます。

$("#sendEmail").before($('<div id="response"><h1>Success</h1><p>Your email was sent.</p></div>').fadeIn("slow"));

基本的にそれが拡張されるものです。

var responseDiv = $('<div id="response"><h1>Success</h1><p>Your email was sent.</p></div>')
  .fadeIn("slow");
$("#sendEmail").before(responseDiv);

Answer 3

#response に CSS ルールを設定して、display: none を設定します。

フェードインするまで表示されません