bootstrap加载状态Button使用方法

Button在Bootstrap中可以添进一些交互，需要引入button.js或者bootstrap.js或压缩版的bootstrap.min.js。

如需向按钮添加加载状态，只需向按钮中添加data-loading-text="Loading..." 作为其属性即可。如下是官方给出的使用方法：

<button type="button" id="myButton" data-loading-text="Loading..." class="btn btn-primary" autocomplete="off">  Loading state</button>

<script>  $('#myButton').on('click', function () {    var $btn = $(this).button('loading')    // business logic...    $btn.button('reset')  })</script>

但是今天在项目中运用并没有得到相应的效果，网上有人说F12追踪js运行看到缺少文件，或许以前有这个问题，但本人用的bootstrap3.3并没有缺少文件，经过反复测试发现看不到效果是因为没有设置延迟时间，在加载的同时又reset了。修改后代码如下所示：

<button type="button" id="saveButton" data-loading-text="保存中..." onclick="saveToModal();" class="btn btn-primary" autocomplete="off">保存</button>

<SCRIPT>function saveToModal(){var btn = $("#saveButton");    btn.button('loading');    setTimeout(function () { btn.button('reset'); },1000);document.getElementById("StudentNum-p").innerHTML = document.getElementById("StudentNum").value;document.getElementById("StudentName-p").innerHTML = document.getElementById("StudentName").value;}</SCRIPIT>

这是在实际项目中截取出来的片段。