<body style="margin: 50px;"> <!--按钮单个切换--> <button class="btn btn-default" data-toggle="button" autocomplete="off">按钮</button> <!--单选框--> <div class="btn-group" data-toggle="buttons"> <label for="" class="btn btn-primary active"> <input type="radio" name="sex" value="男" checked="checked" />男 </label> <label for="" class="btn btn-primary"> <input type="radio" name="sex" value="女" />女 </label> </div> <!--复选框--> <div class="btn-group" data-toggle="buttons"> <label for="" class="btn btn-primary active"> <input type="checkbox" name="sex" value="男" checked="checked" />男 </label> <label for="" class="btn btn-primary"> <input type="checkbox" name="sex" value="女" />女 </label> <label for="" class="btn btn-primary"> <input type="checkbox" name="sex" value="无" />女 </label> </div> <!--加载状态--> <button class="btn btn-primary" data-loading-text="Loading..." autocomplete="off">开始上传</button> <!--代替data-toggle="button"--> <button class="btn btn-primary" autocomplete="off">开始上传</button> <script src="js/jquery.min.js"></script> <script src="js/bootstrap.min.js"></script> <script type="text/javascript"> // $(‘button‘).on(‘click‘,function(){ // var btn = $(this).button(‘loading‘); // setTimeout(function(){ // btn.button(‘reset‘); // },1000); // }); $(‘button‘).on(‘click‘,function(){ $(this).button(‘toggle‘); }); </script> </body>
原文：http://www.cnblogs.com/by-dxm/p/6384745.html