我有一个PHP脚本,它会随机生成一个图像。像这样:
<?php $image = imagecreatetruecolor(400,200); // process image // rendering image header("Content-type: image/jpeg"); imagejpeg($image); ?>
我的html看起来像这样:
<img id="image" src="/models/plugins/image.php"/> <button id="button">Get new image</button></body>
然后,我有一个jquery文件来处理对按钮的单击,以便在单击按钮时加载新的随机图像:
$(function(){ $('#button').click(function(){ $.ajax({ url: 'models/plugins/image.php', success: function(data){ $('#image').html('<img src="' + data + '">') } }) }) })
我使用firebug,可以看到请求实际上已发送,并且响应已成功接收,但是图像没有改变。
我在做什么错,我该如何解决?
我添加了另一个答案,因为我认为以前的答案都无法解决问题。我认为,OP唯一想要的就是单击按钮时更新(!)图像。因此,无需Ajax请求,只需重新加载图像即可。您可以通过将随机查询字符串附加到图像的src属性来强制执行此操作。
$('#button').click(function() { var $image = $('#image'); var plainSrc = $image.attr('src').split("?")[0]; // disregard previous query string $image.attr('src', plainSrc + "?" + (new Date().getTime())); });