Div不会淡出/淡入

我试图让一个div淡出并按下按钮。 它适用于jfiddle但由于某种原因它不能在我的asp.net页面上工作：

$('#btn').click(function(e){ $('#fancy').fadeOut('slow', function(){ $('#fancy').fadeIn('slow'); }); }); 
fade div
 
Fancy Div 

http://jsfiddle.net/3XwZv/1859/

我的asp.net页面：

      $('#btn').click(function (e) { $('#fancy').fadeOut('slow', function () { $('#fancy').fadeIn('slow'); }); });    
Fade div
 
Fancy Div
   

Answer 1

如果你把你的jQuery代码放在head部分并尝试操作DOM元素，它将无法正常工作，因为那时你的HTML文档还没有加载。 因此，您有两种方法可以解决此问题。

首先 ：使用$（document）.ready（）函数并将代码放入其中。 因此，只要您的文档准备就绪，就会触发$（document）.ready（）事件。

 $(document).ready(function () { $('#btn').click(function (e) { $('#fancy').fadeOut('slow', function () { $('#fancy').fadeIn('slow'); }); }); }); 

第二 ：将jQuery代码放在页面底部。

Answer 2

你能分享你实施的这个页面吗？ 没有看到失败的代码就很难知道出了什么问题。 我的第一个猜测是jQuery没有在你的页面上运行。

在此期间，您可以尝试在clickfunction中抛出一个日志，看看是否会触发。

 $('#btn').click(function(e){ console.log('Click fired'); $('#fancy').fadeOut('slow', function(){ $('#fancy').fadeIn('slow'); }); }); 

Answer 3

看起来您可能还没有完成绑定：尝试此代码

 $(function(){ $('#btn').click(function(e){ console.log('Click fired'); $('#fancy').fadeOut('slow', function(){ $('#fancy').fadeIn('slow'); }); }); }