在请求数据加载的过程中,经常需要显示请求等待,写了一个简单的请求等待—-

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玩命加载……的更多相关文章

  1. js 模版加载到前端

    js 模版加载到前端 简单有效不高端 配个路由 /js/:filename ,  用 readTemplate 响应请求,前端可以按模块方式直接 require 模板 'use strict' var ...

  2. 前端设计中关于外部js文件加载的速度优化

    在一般情况下,许多人都是将<script>写在了<head>标签中,而许多浏览器都是使用单一的线程来加载js文件的,从上往下,从左往右. 若是加载过程出错,那么网页就会阻塞,就 ...

  3. js动态加载以及确定加载完成的代码

    利用原生js动态加载js文件到页面,并在确定加载完成后调用相关function var otherJScipt = document.createElement("script") ...

  4. 第三课:sea.js模块加载原理

    模块加载,其实就是把js分成很多个模块,便于开发和维护.因此加载很多js模块的时候,需要动态的加载,以便提高用户体验. 在介绍模块加载库之前,先介绍一个方法. 动态加载js方法: function l ...

  5. js资源加载优化

    互联网应用或者访问量大的应用,对js的加载优化是不可少的.下面记录几种优化方法 CDN  + 浏览器缓存 CDN(content delivery network)内容分发网络, 最传统的优化方式.其 ...

  6. 判断JS是否加载完成

    在正常的加载过程中,js的加载都是同步的,也就是在加载过程中,浏览器会阻塞接下来的内容的加载.这时候我们就要用到动态加载,动态加载是异步的,如果我们在后边要用到这个动态加载的js文件里的东西,就要保证 ...

  7. js动态加载css文件和js文件的方法

    今天研究了下js动态加载js文件和css文件的方法. 网上发现一个动态加载的方法.摘抄下来,方便自己以后使用 [code lang="html"] <html xmlns=& ...

  8. JS懒加载

    4.如何使用js懒加载图片       a.懒加载图片是基于jquery.js的,所以: <script src="jquery.js" type="text/ja ...

  9. JS 动态加载脚本 执行回调_转

    关于在javascript里面加载其它的js文件的问题可能很多人都遇到过,但很多朋友可能并不知道怎么判断我们要加载的js文件是否加载完成,如果没有加载完成我们就调用文件里面的函数是不会成功的.本文讲解 ...

随机推荐

  1. python面试题&练习题之嵌套循环

    1.打印如下结果: 1*5=5 2*10=20 3*15=45 ... 10*50=500 for i in range(1,11): print(str(i)+'x'+str((i*5))+'='+ ...

  2. cube.js 最近版本的一些更新

    有一段时间没有关注cube.js 了,刚好晚上收到一封来自官方的更新介绍,这里简单说明下 更多的数据驱动支持 bigquey, clickhouse snowflake,presto (很棒),hiv ...

  3. tbls ci 友好的数据库文档化工具

    tbls 是用golang 编写的数据库文档化工具,当前支持的数据库有pg.mysql.bigquery 此工具同时提供了变更对比.lint 校验,生成是markdown格式的 简单使用 安装 mac ...

  4. 使用singer 转换gitbase 数据到postgresql

    gitbase 是mysql server 的一个实现(主要是用来分析git仓库代码),但是里面好多功能可能并不是很强大(sql 的限制) 我们可以通过singer 的tap-mysql 将数据抽取到 ...

  5. 干货 | 10分钟带你彻底了解column generation(列生成)算法的原理附java代码

    OUTLINE 前言 预备知识预警 什么是column generation 相关概念科普 Cutting Stock Problem CG求解Cutting Stock Problem 列生成代码 ...

  6. Painting The Fence(贪心+优先队列)

    Painting The Fence(贪心+优先队列) 题目大意:给 m 种数字,一共 n 个,从前往后填,相同的数字最多 k 个在一起,输出构造方案,没有则输出"-1". 解题思 ...

  7. MySQL的ROUND函数

    ROUND(X) ROUND(X,D) 返回参数X, 其值接近于最近似的整数.在有两个参数的情况下,返回 X ,其值保留到小数点后D位,而第D位的保留方式为四舍五入.若要接保留X值小数点左边的D 位, ...

  8. CSS各类布局

    http://www.liquidapsive.com/ 1 静态布局(Static Layout)网页上的所有元素的尺寸一律使用px作为单位.特点:不管浏览器尺寸具体是多少,网页布局始终按照最初写代 ...

  9. 刷题记录:[XNUCA2019Qualifier]EasyPHP

    目录 刷题记录:[XNUCA2019Qualifier]EasyPHP 解法一 1.error_log结合log_errors自定义错误日志 2.include_path设置包含路径 3.php_va ...

  10. mark_rabbitMQ

    一.1.6 和1.7的区别 二.63跟65好像有点差异 有些jar包问题 三.预取策略 https://blog.csdn.net/hry2015/article/details/79078312 四 ...