js玩命加载……
在请求数据加载的过程中,经常需要显示请求等待,写了一个简单的请求等待—-
html代码如下
<!--页面载入显示-->
<div id="dataLoad" style="display:none;position: fixed; left: 0px; right: 0px; background:#fff; bottom: 0px; top: 0px; width:350px; height:120px; margin:200px auto; z-index:999; opacity: 0.92; border: 1px solid #e8e8e8;">
<table width=100% height=100% border=0 align=center>
<tr>
<td align=center>
<img height="50" src="./image/loading.gif" />
</td>
<td align="left">
<span style="font-weight: 900; color: #0394c3;">
数据载入中,请稍后......
</span>
</td>
</tr>
</table>
</div>
在请求的过程中只需要控制<div id="dataLoad"></div>的显示和隐藏即可,js代码如下
$("#dataLoad").hide(); //页面数据加载完毕后即将DIV隐藏
$("#dataLoad").show(); //页面数据加载中显示DIV
当然所需的动态加载图片可以随意选择,我的加载效果如下 
动态图如下 

js玩命加载……的更多相关文章
- js 模版加载到前端
js 模版加载到前端 简单有效不高端 配个路由 /js/:filename , 用 readTemplate 响应请求,前端可以按模块方式直接 require 模板 'use strict' var ...
- 前端设计中关于外部js文件加载的速度优化
在一般情况下,许多人都是将<script>写在了<head>标签中,而许多浏览器都是使用单一的线程来加载js文件的,从上往下,从左往右. 若是加载过程出错,那么网页就会阻塞,就 ...
- js动态加载以及确定加载完成的代码
利用原生js动态加载js文件到页面,并在确定加载完成后调用相关function var otherJScipt = document.createElement("script") ...
- 第三课:sea.js模块加载原理
模块加载,其实就是把js分成很多个模块,便于开发和维护.因此加载很多js模块的时候,需要动态的加载,以便提高用户体验. 在介绍模块加载库之前,先介绍一个方法. 动态加载js方法: function l ...
- js资源加载优化
互联网应用或者访问量大的应用,对js的加载优化是不可少的.下面记录几种优化方法 CDN + 浏览器缓存 CDN(content delivery network)内容分发网络, 最传统的优化方式.其 ...
- 判断JS是否加载完成
在正常的加载过程中,js的加载都是同步的,也就是在加载过程中,浏览器会阻塞接下来的内容的加载.这时候我们就要用到动态加载,动态加载是异步的,如果我们在后边要用到这个动态加载的js文件里的东西,就要保证 ...
- js动态加载css文件和js文件的方法
今天研究了下js动态加载js文件和css文件的方法. 网上发现一个动态加载的方法.摘抄下来,方便自己以后使用 [code lang="html"] <html xmlns=& ...
- JS懒加载
4.如何使用js懒加载图片 a.懒加载图片是基于jquery.js的,所以: <script src="jquery.js" type="text/ja ...
- JS 动态加载脚本 执行回调_转
关于在javascript里面加载其它的js文件的问题可能很多人都遇到过,但很多朋友可能并不知道怎么判断我们要加载的js文件是否加载完成,如果没有加载完成我们就调用文件里面的函数是不会成功的.本文讲解 ...
随机推荐
- lis框架各种方法的使用
//这个必须是lpedorapp表的主键才行LPEdorAppDB tLPEdorAppDB = new LPEdorAppDB();tLPEdorAppDB.setEdorAcceptNo(mEdo ...
- Random Walk——高斯消元法
题目 有一个 $N \times M$ 大小的格子,从(0, 0)出发,每一步朝着上下左右4个格子中可以移动的格子等概率移动.另外有些格子有石头,因此无法移至这些格子.求第一次到达 $(N-1, M- ...
- 实现redis缓存,缓存穿透简单原理
String get(String key) { String value = redis.get(key); if (value == null) { if (redis.setnx(key_mut ...
- python操作json文件获取内容
写case时,将case 写到json文件比写到,写python一定要学会处理json 以下,是要处理的json 处理操作包括:打开json文件,获取json文件内容,关闭json文件,读取内容中的对 ...
- SPI总线协议理解
1.什么是SPI: 是摩托罗拉公司设计的一种全双工通信.高速的.同步的串行外部设备通信协议. 2.SPI作用: 用于设备之间的数据交互. 3.SPI由什么构成: 1)MOSI:主设备输出从设备输入线, ...
- Java HotSpot(TM) 64-Bit Server VM warning: Sharing is only supported for boot loader classes because bootstrap classpath has been appended
Java HotSpot(TM) 64-Bit Server VM warning: Sharing is only supported for boot loader classes because ...
- THUPC&CTS 2019 游记
day ? 去THU报了个到. day? THUPC比赛日,三个人都没有智商,各种签到题不会做,被各路神仙吊着打.G题还猜了个假结论,做了好久都不对.最后顺利打铁了. 还顺便去看一下THUAC. da ...
- 虚拟变量和独热编码的区别(Difference of Dummy Variable & One Hot Encoding)
在<定量变量和定性变量的转换(Transform of Quantitative & Qualitative Variables)>一文中,我们可以看到虚拟变量(Dummy Var ...
- 计蒜客 39280.Travel-二分+最短路dijkstra-二分过程中保存结果,因为二分完最后的不一定是结果 (The 2019 ACM-ICPC China Shannxi Provincial Programming Contest M.) 2019ICPC西安邀请赛现场赛重现赛
Travel There are nn planets in the MOT galaxy, and each planet has a unique number from 1 \sim n1∼n. ...
- js如何将汉字转化为拼音
github地址,上面有封装好的转换工具:https://github.com/sxei/pinyinjs 里面有几个库,根据功能,库的文件大小也不一样,可以根据需求去引入使用. 里面封装好了方法: ...