jquery顯示和隱藏圖像不工作

我有一個代碼到我的網頁之一。當有人點擊單選按鈕時，它應該淡入，保持並淡出圖像。此外，數據庫將使用ajax進行更新。jquery顯示和隱藏圖像不工作

<html> 
<body> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> 

<script type="text/javascript"> 
$("#rad").click(function() { 
    $("#success").fadeIn(500); 
    $("#success").delay(1000); 
    $("#success").fadeOut(1000); 
}) 
</script> 

<table class="profimg"> 
    <tr><td height="50" width="50"><img id="success" src="http://cdn4.iconfinder.com/data/icons/simplicio/128x128/notification_done.png" style="display:none" height="50" width="50"></td></tr> 
    <tr><td align="center"><img class="profimg" src="" alt="Administratorasdf" height="100" width="100"/></td></tr> 
<tr><td id="rad" align="center"><input type='radio' title='Publicly Visible' name='img_pub' onclick="upimg1()" /> <input type='radio' title='Visible Only To Users' value='UsersOnly' name='img_pub' onclick="upimg2()" /> <input type='radio' title='Visible Only To You' value='Hide' name='img_pub' onclick="upimg3()" checked='checked'/></td></tr> 
</table> 

</body> 
</html>

我刪除了ajax部分以避免混淆。這是我用過的jsFiddle。 http://jsfiddle.net/c7ajb/1/什麼可能是錯誤？

來源

2012-11-13 Sid

問題不明確 – Swarne27

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> 

    <script type="text/javascript"> 
     $(document).ready(function(e) { 
      $(".radios").click(function() { 
       $("#success").fadeIn(500).delay(1000).fadeOut(1000); 
      }) 
     }); 
     function upimg1(){} 
     function upimg2(){} 
     function upimg3(){} 
    </script> 
</head> 
<body> 

    <table class="profimg"> 
     <tr> 
      <td height="50" width="50"> 
       <img id="success" src="http://cdn4.iconfinder.com/data/icons/simplicio/128x128/notification_done.png" style="display:none" height="50" width="50"> 
      </td> 
     </tr> 
     <tr> 
      <td align="center"> 
       <img class="profimg" src="" alt="Administratorasdf" height="100" width="100"/> 
      </td></tr> 
     <tr> 
      <td id="rad" align="center"> 
       <input class="radios" type='radio' title='Publicly Visible' name='img_pub' onClick="upimg1()" /> 
       <input class="radios" type='radio' title='Visible Only To Users' value='UsersOnly' name='img_pub' onClick="upimg2()" /> 
       <input class="radios" type='radio' title='Visible Only To You' value='Hide' name='img_pub' onClick="upimg3()" checked='checked'/> 
      </td> 
     </tr> 
    </table> 

</body>

來源

2012-11-13 09:23:58

這是工作：

$("#rad").click(function() { 
    $("#success").fadeIn(500).delay(1000).fadeOut(1000); 
});

的Javascript有時候可以是異步的，如果你不這樣做，這樣一來，delay()將無法正常工作。

您還應該使用回調進行更好的代碼演變。

來源

2012-11-13 09:12:34 Weacked

放入fadeIn函數的回調delay/fadeOut（或鏈中的方法如在對方的回答的建議）：

$("#rad").click(function() { 
    $("#success").fadeIn(500, function() { 
     $(this).delay(1000).fadeOut(1000); 
    }); 
});

Demo here

來源

2012-11-13 09:16:17 billyonecan

jquery顯示和隱藏圖像不工作

回答

相關問題