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

<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. 应收事物处理删除 SQL 语句

    /* Formatted on 2018/3/15 10:07:48 (QP5 v5.256.13226.35538) */ --组织表 SELECT * FROM hr_organization_u ...

  2. c++ 实现atoi()函数

    1. 问题描写叙述 实现c++函数库中atoi()函数,要考虑到各种特殊情况: 空字符串. +和-号. 字符串前中后n个空格. 溢出. 非数字字符. 2. 解决方式 转换过程并不复杂.复杂的是要考虑到 ...

  3. Java web实时进度条整个系统共用(如java上传、下载进度条、导入、导出excel进度条等)

    先上图: 文件上传的: 2017-05-04再次改进.在上传过程中用户可以按 Esc 来取消上传(取消当前上传,或者是全部上传)... 2019-03-26更新进度条显示体验 从服务器上压缩下载: 从 ...

  4. Mac下使用XLD转换无损音乐Ape

    最近想要给音乐库增加一些音乐,下载了一些Ape格式的无损音乐,但是无法直接导入到iTunes中,必须经过其他工具转换成苹果的无损格式,XLD就是这样一款工具.XLD的下载和安装非常方便,直接将APP拖 ...

  5. Java命令学习系列(六)——jinfo

    jinfo可以输出java进程.core文件或远程debug服务器的配置信息.这些配置信息包括JAVA系统参数及命令行参数,如果进程运行在64位虚拟机上,需要指明-J-d64参数,如:jinfo -J ...

  6. Set a Room Mailbox to Show Details of a Meeting in its Calendar – Office 365

    You may notice that meetings with a ‘Room’ mailbox will by default only show a “Busy” status. Many, ...

  7. CImg、libjpeg--介绍、配置(操作JPEG)

    关于处理图片,之前写了两篇博客关于ImageMagick的: <ImageMagick–介绍> <ImageMagick–VS2015环境配置.开发(registrykeylooku ...

  8. 生成学习算法(Generative Learning algorithms)

    一.引言 前面我们谈论到的算法都是在给定\(x\)的情况下直接对\(p(y|x;\theta)\)进行建模.例如,逻辑回归利用\(h_\theta(x)=g(\theta^T x)\)对\(p(y|x ...

  9. Go语言之进阶篇连接mysql

    一.Go连接mysql 1.mysql驱动 地址:https://github.com/Go-SQL-Driver/MySQL 说明: sql.Open()函数用来打开一个注册过的数据库驱动,Go-M ...

  10. 第一章 Typescript 介绍

    Typescript 介绍 一.Typescript 简介 Typescript 是微软开发的 Javascript 的超集,Typescript 兼容 Javascript,可以载入 Javascr ...