AJAX 防止图像被一遍又一遍地加载？答案

【问题标题】：AJAX Prevent Images from being loaded over and over?AJAX 防止图像被一遍又一遍地加载？
【发布时间】：2011-10-30 06:38:01
【问题描述】：

所以我有一个简单的 AJAX 请求（不是 JQuery）：

function ajaxfunction(){
var ajaxRequest;
try{
    ajaxRequest = new XMLHttpRequest();
        } catch (e){
    try{
        ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
        try{
            ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
        } catch (e){
            alert("Your browser sucks"); //error
            return false;
        }
    }
}

ajaxRequest.open("GET", 'pull.php?ms='+new Date().getTime(), true);
ajaxRequest.send(null);  
ajaxRequest.onreadystatechange = function(){
    if(ajaxRequest.readyState == 4){
    var ajaxDisplay = document.getElementById('ajaxDiv');
        ajaxDisplay.innerHTML = ajaxRequest.responseText;
    }
}

}

我希望请求也能拉出图片。由于请求是动态的（显示的图像会改变），我一遍又一遍地请求。但是，这会使图像闪烁。我试过<img src="foobar.jpg" style="visibility:none;" onLoad="this.style.visibility='visible';" /> 但这并没有真正的帮助。如果有人知道任何解决方法，请提前感谢您。 :D

【问题讨论】：

使用Your browser sucks 作为浏览器不支持 XMLHttpRequest 的通知不是最佳实践哈哈，更不用说如果没有启用 javascript，alert() 无论如何都不会发生，想想 linx..
刚刚注意到您没有在提供的代码中检查 ajax 响应的状态代码。您可能还需要考虑检查状态代码 200。

标签： php html css ajax image

【解决方案1】：

我想知道在 img 标签的样式属性中包含图像高度和宽度是否会有所帮助，因为浏览器开始下载图像并获得实际图像高度和宽度需要一秒钟的时间。

【讨论】：

【解决方案2】：

也许不是在 ajax 响应中提取整个 <img> 标记，而是获取图像名称和属性以更改目标图像 src、height、width 等...属性以使用新的图片。

【讨论】：

我喜欢这种想法！无论如何都值得一试:)
它不能在我的实例中工作；我正在创建一个聊天室，这是对谁在线的请求。图像的数量和图像本身可以改变。我需要请求一个全新的图像，导致其他图像闪烁。不过，闪烁并不是真正的问题。
也许您应该将响应中返回的 html 的 sn-p 放入问题中，以便我们可以使用。另外，所有图像的大小都相同吗？刚刚找到这个链接：stackoverflow.com/questions/6648517/… 它适用于 .NET，但有一些技术可以帮助您