ajax缓存为false，无法加载图像

Question

我想通过使用get请求单击按钮时从服务器加载图像，但是每次我使用ajax加载时都会带来缓存的图像，而不是最新的图像

这是我的代码

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$.ajaxSetup({ url:"cap", cache: false });

 $("#btn").click(function(){
        $("#mydiv").load("cap");
    });
});

</script>


             <div style="display:block;margin-bottom:20px;margin-top:20px;">

             <div id='mydiv'></div>
            </div>
            <button id='btn'  > reload  </button>

Answer 1

为什么不将<img>标记集成到<div id='mydiv'></div> ？ 然后，您可以更改src属性以更改图像，而无需使用ajax。

将唯一字符串添加到图像请求时，可以刷新图像。

例如，您可以通过调用以下内容获取图像：

<img src="http://www.example.com/pictures/img.png?123">

<img src="http://www.example.com/pictures/img.png?456">

这是避免缓存的一种方法。 为了动态地执行此操作，您可以使用date对象并将当前日期添加到您的URL中。

$("#myImg").prop("src", "myImg.png?" + new Date().valueOf());