onClick 重新加载 div 中的图像

Question

这是我的代码：

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

这是我页面上的一小段代码。第 2 行将加载验证码图像，我希望第 3 行仅重新加载该 div 而不是整个页面，以便验证码会更改。这可能吗？请指导我。

Answer 1

您可以通过向图像附加 a 来强制 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

只需重新加载即可：

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

随机将摆脱浏览器缓存问题并强制重新加载它。