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="保存中..." οnclick="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>

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