設置bootstrap按鈕組選中狀態

使用bootstrap(V3.3.7)按鈕組（btn-group）時，很多時候我們需要按鈕組在顯示的時候，預先設置一個按鈕處於選中狀態。

<div class="text-right" style="margin-bottom:0.5em;">
	排序：<span class="btn-group btn-group-sm" role="group" id="orderBtnGroup">
		<button class="btn btn-default" onclick="showAccessList('createDate')">時間</button>
		<button class="btn btn-default" onclick="showAccessList('readCount')">閱讀</button>
		<button class="btn btn-default" onclick="showAccessList('goodCount')">點贊</button>
	</span>
</div>

可以通過兩種方法：為按鈕添加active類（寫在html代碼里）、用js方法。兩種方法的本質是一樣的。后一種方法可以把按鈕點擊事件調用、按鈕狀態修改統一起來。

$("#orderBtnGroup .btn:first").click().addClass("active");

但是有個問題，就是當點擊按鈕組其他按鈕時，不能清除選中狀態。目前沒有找到好的辦法。只好在按鈕的點擊事件中，去除一下所有按鈕的active狀態。

$("#orderBtnGroup").children().removeClass("active");