首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

jQuery和IE缓存有关问题

2013-01-05 
jQuery和IE缓存问题很简单的功能,分别点击按钮1和2,将切换图片区域的图片script typetext/javascript

jQuery和IE缓存问题
很简单的功能,分别点击按钮1和2,将切换图片区域的图片


<script type="text/javascript">
        $(function () {
            $('#Button1').click(function () {
                $('#testimg').attr({ src: "images/1.jpg", alt: "Test Image" });
            })
            $('#Button2').click(function () {
                $('#testimg').attr({ src: "images/2.jpg", alt: "Test Image" });
            })

        })
    </script>


 <input id="Button1" type="button" value="button1" />
 <input id="Button2" type="button" value="button2" />
 <img id="testimg" alt="jQuery和IE缓存有关问题" />

但是IE下由于缓存的作用,当我点击按钮1时是1.jpg,正常显示。然后我用新的1.jpg代替原来的1.jpg时,显示的还是老的1.jpg。无论你怎么点击,反正就是不会加载新的1.jpg。除非你清理一下缓存。
请问有什么方法能够让jQuery避免这种现象呢?因为我服务器上的新图片会替代原来的就图片。比如上传头像,新的头像会替代旧的头像,但是头像都是用id的形式来命名所以文件名不会变。如何解决呢?
ps:用chrome浏览器不会有此类问题。但是客户要求支持IE浏览器
[解决办法]
<script type="text/javascript">
        $(function () {
            $('#Button1').click(function () {
                $('#testimg').attr({ src: "images/1.jpg?"+new Date().getTime(), alt: "Test Image" });
            })
            $('#Button2').click(function () {
                $('#testimg').attr({ src: "images/2.jpg?"+new Date().getTime(), alt: "Test Image" });
            })
 
        })
    </script>
[解决办法]
1、时间戳
2、随机数

热点排行