Bootstrap 按钮,Button插件加载状态

通过按钮(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">

<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>