一、在页面中加入如下代码

<div class="modal fade" tabindex="-1" role="dialog" id="waitingModal">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">正在操作中...</h4>
</div>
<div class="modal-body">
<div class="progress">
<div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="" aria-valuemin="" aria-valuemax="" style="width: 100%">
<span class="sr-only">%</span>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" disabled class="btn btn-default" data-dismiss="modal">正在操作,请勿关闭或刷新页面!</button>
</div>
</div>
</div>
</div>

    <script>
      function showWaiting() {
        $('#waitingModal').modal({
          keyboard: false,
          backdrop: 'static',
          show: true
        });
      }
      function hideWaiting() {
        $('#waitingModal').modal('hide');
      }
    </script>

二、使用的地方

  显示:showWaiting()

  隐藏:hideWaiting()

三、效果

  

Bootstrap相关网站中简单的等待提醒的更多相关文章

  1. bootstrap设计网站中添加代码高亮插件

    这款插件的名字叫做google-code-prettify 使用该插件之前的效果: 使用插件之后的效果: 接下来说步骤: (1)下载两个文件 http://codecloud.sinaapp.com/ ...

  2. Sticker.js – 帮助你在网站中加入贴纸效果

    Sticker.js 是一个很小的 JavaScript 库,它允许您在网页中创建漂亮的贴纸效果.没有依赖关系(不需要 jQuery),可以在大多数支持 CSS3 的主流浏览器工作.下面有简单的使用示 ...

  3. 新西兰程序员 ASP.NET网站中设置404自定义错误页面

    新西兰程序员 ASP.NET网站中设置404自定义错误页面 在用ASP.NET WebForm开发一个网站时,需要自定义404错误页面. 做法是这样的 在网站根目录下建立了一个404.html的错误页 ...

  4. Bootstrap相关资料

    WEB项目中,使用Bootstrap较多.但是一些插件却比较确实,所以整理了一份Bootstrap相关插件的地址.基本满足日常WEB开发中插件需求.并且还挺好用的 bootstrap说明文档,有问题可 ...

  5. 最值得收藏的Bootstrap资源网站

    如果你正在寻找Bootstrap图标,那今天的推荐对你而言绝对非常重要!在这篇内容中,我们把这套框架上的免费字体图 标做了个整合(当然,以后还会不断的更新).正如你所知,图标字体在一个web网页设计拥 ...

  6. TogetherJS – 酷!在网站中添加在线实时协作功能

    TogetherJS是一个免费.开源的 JavaScript 库,来自 Mozilla 实验室,可以实现基于 Web 的在线协作功能.把 TogetherJS 添加到您的网站中,您的用户可以在实时的互 ...

  7. 网站中的专题页或者tag聚合页的权重不错

    一.据最近的一些观察,觉得网站中的专题页或者tag聚合页的权重不错,因此多给网站制作一些专题页面,不仅有利于聚合站内的文章,更是绝对的原创内容,应该会受到百度的青睐.简评:关于权重的讨论,这篇无疑是很 ...

  8. RulersGuides.js – 网站中实现 Photoshop 标尺效果

    RulersGuides.js 是一个 JavaScript 库,在网页上添加类似 Photoshop 中的标尺和辅助网格线.要创建创建网格线线,请单击垂直或水平的标尺,然后推动就可以.还可以使用相应 ...

  9. 释放SQL Server占用的内存 .Net 读取xml UrlReWriter 在web.config中简单的配置

    释放SQL Server占用的内存   由于Sql Server对于系统内存的管理策略是有多少占多少,除非系统内存不够用了(大约到剩余内存为4M左右),Sql Server才会释放一点点内存.所以很多 ...

随机推荐

  1. ASP.NET MVC:三个被隐藏的扩展性“钻石”(转载)

    原文地址:http://haacked.com/archive/2010/05/16/three-hidden-extensibility-gems-in-asp-net-4.aspx/. ASP.N ...

  2. python测试开发django-30.发送附件EmailMessage

    前言 Django的 send_mail() 和 send_mass_mail() 函式事实上是对 EmailMessage 类使用方式 的一个轻度封装.send_mail() 和相关的其他封装函式并 ...

  3. Swift - 用CATransform3DMakeRotation实现翻页效果

    Swift - 用CATransform3DMakeRotation实现翻页效果 效果 源码 https://github.com/YouXianMing/Swift-Animations // // ...

  4. 利用Linux的Samba服务模拟NT域

    利用Linux的Samba服务模拟NT域 Samba是一个与Windows NT具有相同协议的软件包.我们可以利用Samba服务来模拟 Windows NT域,使用户从Windows计算机上直接使用一 ...

  5. Web 前沿——HTML5 Form Data 对象的使用

    原文地址:http://www.cnblogs.com/lhb25/p/html5-formdata-tutorials.html XMLHttpRequest Level 2 添加了一个新的接口-- ...

  6. DP思路

    在这里记录一些在大神们的博客,以及自己做过的一些DP的神奇思路吧 1.2015/04 NEUQ 月赛  转自:http://zyfzyf.is-programmer.com/posts/89993.h ...

  7. fasttext介绍和试用

    http://fasttext.apachecn.org/cn/docs/v0.1.0/support.html fasttext介绍网站 https://github.com/facebookres ...

  8. 大数据开发实战:Storm流计算开发

    Storm是一个分布式.高容错.高可靠性的实时计算系统,它对于实时计算的意义相当于Hadoop对于批处理的意义.Hadoop提供了Map和Reduce原语.同样,Storm也对数据的实时处理提供了简单 ...

  9. 从头认识java-18.2 主要的线程机制(4)-优先级

    这一章节我们来讨论一下多线程的优先级问题. 1.样例: package com.ray.ch17; public class Test { public static void main(String ...

  10. 用Maven构建单机Mahout项目

    Hadoop家族系列文章,主要介绍Hadoop家族产品,常用的项目包括Hadoop, Hive, Pig, HBase, Sqoop, Mahout, Zookeeper, Avro, Ambari, ...