通过按钮(Button)插件,您可以添加进一些交互、比如控制按钮的状态、或者为其它组件(工具栏)创建按钮组。

加载状态

如需向按钮添加加载状态，只需要简单地向 button 元素添加 data-loading-text="Loading..." 作为其属性即可，如下面实例所示：

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Bootstrap历练实例：按钮(Button)插件加载状态</title>
<meta charset="utf-8" />
<meta name="viewport"content="width=device-width,initial-scale=1.0" />
<script src="jQuery/jquery-2.1.4.js"></script>
<link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.min.css" />
<script src="bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container"style="padding:20px">
<button type="button"class="btn btn-success"data-loading-text="Loading...">加载状态</button>
</div>
<script>
$(document).ready(function () {
$(".btn-success").click(function () {
$(this).button("loading").delay(2000).queue(function () {

})
})
})
</script>
</body>
</html>

Bootstrap 按钮(Button)插件加载状态的更多相关文章

  1. bootstrap按钮加载状态改变

    bootstrap里面有个激活按钮的时候,按钮变成不可用的: 按照官网里面的方法介绍是在button按钮加个data-loading-text="Loading..."属性,然后j ...

  2. Bootstrap历练实例：按钮(Button)插件单个切换

    单个切换 如需激活单个按钮的切换(即改变按钮的正常状态为按压状态,反之亦然),只需向 button 元素添加 data-toggle="button" 作为其属性即可,如下面实例所 ...

  3. Bootstrap Table表格一直加载(load)不了数据-解决办法

    bootstrap-table是一个基于Bootstrap风格的强大的表格插件神器,官网:http://bootstrap-table.wenzhixin.net.cn/zh-cn/ 这里列出遇到的一 ...

  4. 动态加载JS文件，并根据JS文件的加载状态来执行自己的回调函数

    动态加载JS文件,并根据JS文件的加载状态来执行自己的回调函数, 在很多场景下,我们需要在动态加载JS文件的时候,根据加载的状态来进行后续的操作,需要在JS加载成功后,执行另一方法,这个方法是依托在加 ...

  5. 基于.NET MVC的高性能IOC插件化架构(二)之插件加载原理

    上一篇博文简单介绍了下插件化的代码组成部分:http://www.cnblogs.com/gengzhe/p/4390932.html,源码地址:https://github.com/luohuazh ...

  6. bootstrap模态框远程加载网页的正确处理方式

    bootstrap模态框远程加载网页的方法 在bootsrap模态框文档里给出了这个方法: 使用链接模式 <a data-toggle="modal" href=" ...

  7. RxJava异步请求加载状态控制

    在我看来,RxJava最大的特点就是异步,无论你是解析复杂的数据或是IO操作,我们都可以利用它内置的线程池进行线程间的调度,简单的使用 subscribeOn(Schedulers.io()).doO ...

  8. 【清单】值得「等待」的12个指示加载状态的 js 库

    以下优选 GitHub 上高 star 的指示加载状态的 JavaScript 库.另外这里还有10个有意思的 JavaScript 实战小项目供大家学习. 上期入口:一份数据分析学习清单.xls M ...

  9. 加载状态为complete时移除loading效果

    一.JS代码: //获取浏览器页面可见高度和宽度 var _PageHeight = document.documentElement.clientHeight, _PageWidth = docum ...

随机推荐

  1. CTS/APIO后文化课游记

    根据ghj1222的尿性,干什么事都要写一个游记划水记啥的...然后就写嘛... 现在是5.30微机课,先开个坑,学校6.5放假,我将于6.5后开始更新本文 APIO回来后发生的事真的特别多...有的 ...

  2. POJ2758 Checking the Text 哈希

    注意到插入次数挺少的,于是每次暴力重构,然后哈希+二分 #include<cstdio> #include<iostream> #include<algorithm> ...

  3. HDU 6153 A Secret 套路，求解前缀在本串中出现的次数

    http://acm.hdu.edu.cn/showproblem.php?pid=6153 首先相当于翻转两个串,然后求s2前缀在s1中出现的次数. 这是一个套路啦 首先把两个串结合起来,中间加一个 ...

  4. python3+Appium自动化07-滑动操作以及滑动方法封装

    滑动解析 滑动主要分为:水平滑动.垂直滑动.任意方向滑动 滑动轨迹 在Appium中模拟用户滑动操作需要使用swipe方法,该方法定义如下: def swipe(self, start_x, star ...

  5. Spring Junit测试（非web，即不包含Controller测试）

    使用Spring-Test对Spring框架进行单元测试 配置过程: lib加入导入spring-test.jar和junit包 或者使用Maven依赖: <dependency> < ...

  6. Oracle子查询和多表查询

    多表查询需要用到表的连接 连接可以分为:(自行百度) 交叉连接(数字逻辑的笛卡尔积,不做解释) 等值连接 例如:select * from t_a, t_b where t_a.xx = t_b.xx ...

  7. Primefaces dataTable设置某个cell的样式问题

    设置primefaces dataTable的源网段列的Cell可以编辑,当回车键保存时,判断是否输入的网段合法,如果不合法就显示警告信息,并将这个不合法的数据用红色表示.问题是,怎么给这一个cell ...

  8. cucumber的hooks

    引用链接:https://github.com/cucumber/cucumber/wiki/Hooks Hooks Cucumber provides a number of hooks which ...

  9. 使用AOP监控用户操作并插入数据库

    引入依赖 <!--spring切面aop依赖--> <dependency> <groupId>org.springframework.boot</group ...

  10. python property用法

    参考 http://openhome.cc/Gossip/Python/Property.html http://pyiner.com/2014/03/09/Python-property.html ...