如何将'before'方法与jQuery中的'fadeIn'方法结合起来?

时间:2009-03-29 00:17:18

标签: javascript jquery effects

我有一行jquery,它在使用jQuery之前的方法在页面上已经在另一个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,所以没有任何反应。

我觉得我很亲密,但我无法理解。有人可以帮忙吗?

3 个答案:

答案 0 :(得分:7)

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

答案 1 :(得分:4)

尝试添加一个额外的$(),这将在响应上调用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);

答案 2 :(得分:1)

在#response上设置css规则以显示:none

然后直到你淡入

才会显示