项目中有需求,断网后,显示小提示窗,里面包含网络异常提示语和异常小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;
}

使用图片预加载,解决断网后无法从后台获取提示网络异常的logo图片的问题的更多相关文章

  1. vue图片预加载

    目的: 图片预加载能够使得用户在浏览后续页面的时候,不会出现图片加载一半导致浏览不流畅的情况. 一.方法一 项目打开的时候要对图片进行预加载,在App.vue里面的beforeCreate添加预加载程 ...

  2. Javascript图片预加载详解

    预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发布 ...

  3. Javascript图片预加载详解 分类: JavaScript HTML+CSS 2015-05-29 11:01 768人阅读 评论(0) 收藏

    预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发布 ...

  4. 利用简洁的图片预加载组件提升h5移动页面的用户体验

    在做h5移动页面,相信大家一定碰到过页面已经打开,但是里面的图片还未加载出来的情况,这种问题虽然不影响页面的功能,但是不利于用户体验.抛开网速的原因,解决这个问题有多方面的思路:最基本的,要从http ...

  5. AngularJS进阶(三十)AngularJS项目开发技巧之图片预加载

    AngularJS项目开发技巧之图片预加载 绪 项目(移动端采用Ionic 框架)开发完毕,测试阶段发现移动APP首页的广告图片(图片由服务器端返回相应url地址)很难加载,主要原因还是网速.如下图左 ...

  6. 转载:用Jquery实现的图片预加载技术,可以实现有序加载和无序加载!

    一.背景 我们在做页面的时候,从用户体验的角度出发,肯定是希望用户以最快的速度看到完整的页面信息,但在实际情况中经常会遇到些问题. 比如受网速影响,页面加载素材的时间比较长,页面会出现短时间的错乱或者 ...

  7. jquery.imgpreload.min.js插件实现页面图片预加载

    页面分享地址: http://wenku.baidu.com/link?url=_-G8miwbgDmEj6miyFtjit1duJggBCJmFjR2jky_G1VftD9eS9kwGOlFWAOR ...

  8. Javascript实现图片预加载【回调函数,多张图片】

    使用JS实现一组图片动画效果或者使用HTML5 Canvas渲染一系列图片等案例中,需要图片全部加载完成方可运行动画效果.此时程序中就会涉及多张图片预加载代码.当接二连三的案例中都涉及图片预加载时,就 ...

  9. JS实现图片预加载无需等待

    网站开发时经常需要在某个页面需要实现对大量图片的浏览;用javascript来实现一个图片浏览器,让用户无需等待过长的时间就能看到其他图片 网站开发时经常需要在某个页面需要实现对大量图片的浏览,如果考 ...

随机推荐

  1. ST3 插件和技巧

    Emmet插件: 快速生成HTML文档结构, 快速编写跨浏览器的CSS并自动帮助你同时编辑, 强大! 语法技巧 简单实用, 值得掌握! SideBar Enhancements插件:  改进了侧边栏, ...

  2. 2018.09.28 hdu5434 Peace small elephant(状压dp+矩阵快速幂)

    传送门 看到n的范围的时候吓了一跳,然后发现可以矩阵快速幂优化. 我们用类似于状压dp的方法构造(1(1(1<<m)∗(1m)*(1m)∗(1<<m)m)m)大小的矩阵. 然后 ...

  3. 2018.06.29 NOIP模拟 边的处理(分治+dp)

    边的处理(side.cpp) [问题描述] 有一个 n 个点的无向图,给出 m 条边,每条边的信息形如<x,y,c,r><x,y,c,r><x,y,c,r>. 给出 ...

  4. 马婕 2014年MBA,mpacc备考 报刊宣读1 中国的电子商务(转)

    http://blog.sina.com.cn/s/blog_3e66af4601015fxi.html 中国电子商务蓄势待发 Chinese e-commerce中国电子商务Pity the par ...

  5. sql笔试练习

    转:http://www.360doc.com/content/16/0919/17/14804661_592046675.shtml 本文是在Cat Qi的参考原帖的基础之上经本人一题一题练习后编辑 ...

  6. python 实现排列组合

    1.python语言简单.方便,其内部可以快速实现排列组合算法,下面做简单介绍. 2.一个列表数据任意组合 2.1主要是利用自带的库 #_*_ coding:utf-8 _*_ #__author__ ...

  7. 基于SceneControl单击查询功能的实现

    private void HandleIdentify_MouseDown(object sender, ISceneControlEvents_OnMouseDownEvent e) { this. ...

  8. Spring bean是如何加载的

    Spring bean是如何加载的 加载bean的主要逻辑 在AbstractBeanFactory中doGetBean对加载bean的不同情况进行拆分处理,并做了部分准备工作 具体如下 获取原始be ...

  9. 图片适应bitmap的大小 http上传文件

    image.setAdjustViewBounds(true); http上传文件 http://www.eoeandroid.com/thread-90209-1-1.html http://www ...

  10. PAT 甲 1005. Spell It Right (20) 2016-09-09 22:53 42人阅读 评论(0) 收藏

    1005. Spell It Right (20) 时间限制 400 ms 内存限制 65536 kB 代码长度限制 16000 B 判题程序 Standard 作者 CHEN, Yue Given ...