bootstrap3-button 按钮

具有加载效果的按钮

照着bootstrap网站上的例子写，怎么都没反应

只能想别的办法来实现这个效果了

	<!-- 具有加载效果的按钮 --><button type="button" id="fat-btn" class="btn btn-primary">Hello</button><script src="../../jquery/jquery-10.0.2.js"></script>
<script>
$(function(){var $btn = $('#fat-btn');$btn.click(function(){var $this = $(this);//禁用，设置按钮上显示的文字 $this.attr('disabled', 'disabled').html("Loading...");setTimeout(function () {//3秒后，恢复状态  $this.removeAttr('disabled').html('Complete');}, 3000)});
})
</script>

以下有bootstrap提供的功能，需要加入button.js，否则没有效果！

状态切换

通过添加data-toggle="button"可以让按钮能够切换状态

<button class="btn btn-primary" data-toggle="button">Single Toggle</button>

按下

 
 弹起

 

选择框

通过向按钮组添加data-toggle="buttons"可以使按钮组具有类似选择框的选择/取消功能。

把默认checkbox框的样式改为按钮样式，按钮处于按下状态等效于勾选checkbox框

<div class="btn-group" data-toggle="buttons"><label class="btn btn-primary"> <input type="checkbox"> checkbox 1</label> <label class="btn btn-primary"> <input type="checkbox"> checkbox 2</label> <label class="btn btn-primary"> <input type="checkbox"> checkbox 3</label></div>

如，前2个按钮被按下，表示选择前2个选项

 

单选

通过向按钮组添加data-toggle="buttons"可以让按钮组具有单选框的功能。

<div class="btn-group" data-toggle="buttons"><label class="btn btn-primary"> <input type="radio" name="options" id="option1"> radio 1</label> <label class="btn btn-primary"> <input type="radio" name="options" id="option2"> radio 2</label> <label class="btn btn-primary"> <input type="radio" name="options" id="option3"> radio 3</label></div>

 只有1个按钮可以被按下