我正在创建一个允许用户上传图像的输入表单。一旦提交,用户将返回到表单,并在顶部显示一个确认位。
任何已提交的图像,然后通过对存储图像URL的MySQL数据库的查询预览。但是,如果用户上传了一张照片,它会被预览,然后他们决定更改照片并重新提交表单,当它带您回到表单时,新照片不会显示,除非您手动按浏览器上的刷新。
是否有办法强制刷新/缓存删除或刷新特定的图像,而不是整个页面?
谢谢
将修改后的日期添加到图像末尾作为查询。
<img src="/images/photo.png?=1239293"/>
在PHP中<img src="/images/photo.png?=<?php echo filemtime($filename)?>"/>
在PHP中,你可以发送一个随机数或当前时间戳:
<img src="image.jpg?<?=Date('U')?>">
或
<img src="image.jpg?<?=rand(1,32000)?>">
这里的技巧是告诉浏览器不要缓存内容。您可以通过将这些语句放在其他任何东西之前(没有空格或任何东西!)
来实现这一点。<?php
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
header("Cache-Control: no-store, no-cache, must-revalidate");
header("Cache-Control: post-check=0, pre-check=0", false);
header("Pragma: no-cache");
?>
根据你加载图像的方式,你也可以使用jQuery对图像进行javascript刷新。
这对我来说很有效:
image.jpg?=<?php echo rand() . "'n";?>
您可以使用JavaScript将当前图像替换为新图像:
<div id="imageHolder">this is where the image will show</div>
<script type="text/javascript">
function myfunction(){
document.getElementById("imageHolder").innerHTML="<div id='"imageHolder'"><img src='imagefolder/imagename.jpg' alt=''/></div>";
}</script>
你需要在完成上传后触发函数myfunction…