的onClick重新加載圖像中的div

Question

這裏是我的代碼：

<div id='captcha'> 
<img src='captcha.php'> 
<a href=''>Reload Captcha</a> 
</div> 

這是，我有我的網頁上一小段代碼。第2行將加載驗證碼圖像，我希望第3行僅重新加載該div而不是整個頁面，以便驗證碼將更改。 這甚至可能嗎？請指導我。

Answer 1

您可以強制DOM通過附加#將它重新加載圖像。

使用jQuery：

<div id='captcha'> 
    <img src='captcha.php' id="captcha_image" /> 
    <a href='javascript:void(0);' id="reload_captcha">Reload Captcha</a> 
</div> 

$('#reload_captcha').click(function(event){ 
    $('#captcha_image').attr('src', $('#captcha_image').attr('src')+'#'); 
}); 

Answer 2

您可以使用javascript removeElement(...)刪除div，然後再將該元素添加到dom createElement(...)。那麼應該重新加載圖像。

Answer 3

使用jQuery你可以做這樣的：

$("#captcha").load(location.href+" #captcha>*","");

哪裏#captcha是要重新加載零件的ID。 具體而言，此代碼應該做的工作：

<a href="#" onclick="$('#captcha').load(location.href+' #captcha>*','');return false;"> 
Reload Captcha 
</a> 

Answer 4

只是爲了只需重新加載，您可以：

<img src='captcha.php' onClick="this.src='captcha.php?rand='+Math.random();">

隨機將擺脫瀏覽器緩存的問題，並會強制重新加載它。