jQuery的淡入淡出不工作

有人可以告诉我我做错了什么：

样式：

.warning{border: 1px solid #F0AAAA; background:#FFBABA; color: #C90000;} 

标记：

  <p class="warning">A successful authorization already exists. Further authorizations are not allowed at this time.</p> 

脚本：

  $().ready(function () { alert($(".warning").html()); // WORKS $(".warning").fadeIn(4000); // DOESN'T WORK }); 

Answer 1

除非元素被隐藏，否则不会出现淡化，你需要这样的东西：

 $(".warning").hide().fadeIn(4000); 

你可以在这里试试 ， $()在1.4以上不推荐使用，你应该使用$(document)或者更短的版本，如下所示：

 $(function() { $(".warning").hide().fadeIn(4000); }); 

另一种方法是给元素一个display: none最初display: none 但这打破了JS禁用的用户，或者如果JavaScript错误发生，防止淡出，所以你可能想要避开这种方法。

Answer 2

添加display:none你的CSS代码。

 .warning{border: 1px solid #F0AAAA; background:#FFBABA; color: #C90000;display:none} 

Answer 3

我会倾向于认为你想要一些事件来pipe理时尚。 看到这里的工作示例： http : //jsfiddle.net/hPHPn/

从而：

 $(document).ready(function(){ $(".warning").hide();// hide it initially $('#unhideit').click(function(){ $(".warning").fadeIn(4000); }); }); 

对于一些简单的标记：

 <p class="warning">A successful authorization already exists for this Quote ID. Further authorizations are not allowed at this time.</p> <input type="button" id="unhideit" value="clickme" /> 

Answer 4

我最近在我的应用程序中做了同样的事情。 在我的html文档的顶部，我有：

 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script type="text/javascript" src="advtemp3jquery.js"></script> 

src="advtemp3jquery.js是指我的外部.js文件，我发现它更简洁，可以将代码保存在外部文件中。

该脚本执行以下操作：

 $(document).ready(function() { $('.header1,.header2').fadeIn('4000'); });