如何将 'before' 方法与 jQuery 中的 'fadeIn' 方法结合使用？

Question

我有一行 jquery 正在使用 jQuery 的 before 方法在页面上已经存在的另一个 div 之前插入一个 div：

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

我想让新的 div 淡入，所以我尝试以两种不同的方式组合这些方法，但都不能正常工作。这是我尝试过的：

$("#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 规则以显示：无

在你淡入之前它不会显示