Question

我有一个PHP函数来生成图像：

function gen_img(){
$image = imagecreate(200,200);
.... //some php codes
header("Content-type:image/jpeg");
imagejpeg($image);
}
// there is no problem when generating image, image generated successfully when i call the function

我知道怎么把它放在html上用这个：

<img id='imageone' src="link to the function">
// the image shown, loaded in the <img> tag, no problem

但是，现在我希望使用jquery ajax加载图像，然后将其放入<img>标记中。有人可以告诉我的方式吗？

Answer 1

我建议base64编码图像数据

$data = imagecreate(200,200);
$type = 'jpeg';
$base64 = 'data:image/' . $type . ';base64,' . base64_encode($data);
echo $base64;

在javascript部分你应该能够做到：

document.getElementById('captha').src='data:image/png;base64,iVBORw0KGgoAAAANSUh............................. etc...';

完整的例子：

<img src="blank.gif" id="captha">
<script type="text/javascript">
jQuery.ajax('captha.php?ident=xyhksj78').done(function(data){
      document.getElementById('captha').src=data;
      });
</script>

Answer 2

我想要刷新图像，它是随机图像。它最像是验证码

仍然不需要使用AJAX。

为image元素设置一个新的src属性值。你可以f.e.将当前时间戳值添加为查询字符串参数，以便浏览器再次从服务器请求它，而不是从其缓存中获取它：

$('#imageone').attr('src', 'scriptname.php?' + (new Date).getTime());

完成......

通过ajax将图像从php发送到html

2 个答案: