Bootstrap 按钮

【Bootstrap 按钮】

　　Bootstrap插件给按钮添加了loading状态。

　　　　1）调用button("loading")即可切换至loading状态。

　　　　2）调用button("reset")即可切换至reset状态。

　　　　3）data-loading-text="Loading..."属性用于设置loading状态时的文字。

　　　　4）data-complete-text="Loading finished"，用于设置complete状态时的文字。

<button id="fat-btn" class="btn btn-primary" data-loading-text="Loading..." 
       type="button"> 加载状态
</button>
<script>
    $(function() {
        $(".btn").click(function(){
            $(this).button('loading').delay(1000).queue(function() {
                $(this).button('reset');
                $(this).dequeue(); 
            });
        });
    });  
</script>

　　

2、data-toggle属性指明的是toggle目标，比如下拉菜单"dropdown”、按钮"button"、多个按钮“buttons”、tab切换“tab”。

　  下面代码使用buttons来切换单选按钮。

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

参考：http://www.runoob.com/bootstrap/bootstrap-button-plugin.html