jQuery：如何使用fadeToggle（）？

我想使用jQuery的fadeToggle()函数。

我有一个隐藏的div，当我点击一个链接，然后我想调用fadeToggle() ，div淡入并在另一次点击淡出后。

线索是，我想用自己的function点击后调整窗口大小（效果很好）。

目前我有这个解决方案：

 jQuery: $("#myLink").live("click", function () { $("#myDiv").toggleClass("myDivClass"); Resize(); }); Css:  #myDivclass { display:none; }  

它工作得很好，但我想用fadeToggle()而不是toggleClass()做同样的事情。

问题是，在第二次单击之后（在div淡出之后），窗口没有resize – 它使用toggleClassresize但不使用fadeToggleresize。

Answer 1

您可能需要提供Resize函数作为fadeToggle方法的回调，因此它在动画完成时运行：

 $("#myLink").live("click", function () { $("#myDiv").fadeToggle(1000, Resize); }); 

请注意，如果您需要将参数传递给Resize函数，则必须使用匿名回调：

 $("#myLink").live("click", function () { $("#myDiv").fadeToggle(1000, function() { Resize(); }); }); 

另外，如果你使用的是最新版本的jQuery，你绝对不应该使用live 。 请改用（如果您使用的是旧版本，则delegate仍然更好）。

Answer 2

您可以尝试将resize添加到回调函数，可能是在调用Resize动画尚未完成，因此您无法获得所需的效果。

 $("#myDiv").fadeToggle("fast", function () { Resize(); }); 

Answer 3

也许是因为你必须等到fadeToggle函数完成，试试这个：

 $("#myLink").live("click", function () { $("#myDiv").fadeToggle('slow', function(){ Resize(); }); });