使用图片预加载,解决断网后无法从后台获取提示网络异常的logo图片的问题
项目中有需求,断网后,显示小提示窗,里面包含网络异常提示语和异常小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; }