使用图片预加载，解决断网后无法从后台获取提示网络异常的logo图片的问题-CSDN博客

项目中有需求，断网后，显示小提示窗，里面包含网络异常提示语和异常小logo图片。

在实际操作时，遇到，断网后，无法从后台获取异常小logo图片。

我是才用图片预加载的方法解决这个问题的，解决方法如下：

/*预加载图片*/
//var url = "http://192.168.0.5:8080/";
var url = getRootPath() ;
var urlImg = url+"/adms/********/images/messager-info.png";//警告图标路径
var imgPreLoadBox = [];

/*预加载图片*/
preLoadImgs(1,urlImg);

function preLoadImgs(i,url) {
    imgPreLoadBox[i] = new Image(); //创建一个Image对象，实现图片的预下载
    imgPreLoadBox[i].src = url;
}

/*将预加载图片插入到div*/
function appendImgTo(divId,img){
    if(img.complete) { // 如果图片已经存在于浏览器缓存，直接调用回调函数
        $(divId).append(img);
        return; // 直接返回，不用再处理onload事件
    }

    img.onload = function () {
        $(divId).append(img);
    }
}



function getRootPath(){
    //获取当前网址，如： http://localhost:8083/uim/********/meun.jsp
    var curWwwPath=window.document.location.href;
    //获取主机地址之后的目录，如： uim/******/meun.jsp
    var pathName=window.document.location.pathname;
    var pos=curWwwPath.indexOf(pathName);
    //获取主机地址，如： http://localhost:8083
    var localhostPaht=curWwwPath.substring(0,pos);
    //获取带"/"的项目名，如：/uimcardprj
    //var projectName=pathName.substring(0,pathName.substr(1).indexOf('/')+1);
    return localhostPaht;
}