使用jquery設置基於選擇狀態的表單標籤樣式？

Question

我有單選按鈕形式，如在

<label for="challenge" class="fat">Challenge 
    <input type="radio" name="create-what" value="challenge" id="challenge"> 
</label> 
<label for="team" class="fat">Team 
    <input type="radio" name="create-what" value="team" id="team"> 
</label> 

顯然，點擊標籤選擇無線電。我還需要做的是根據單選按鈕的選定狀態更改標籤的類別。所以，給所選收音機的標籤添加一個「活動」類，如果收音機未被選中，則將其刪除。

我有很多這樣的對，所以我一直在尋找最便攜的方式。謝謝。

Answer 1

在jQuery是通過基於checked狀態

$('input:radio').change(function(){ 

    $(this).parent().toggleClass('active', this.checked).siblings().removeClass('active'); 
}); 

toggleClass監測change事件和切換類相當簡單允許第二個參數的布爾，以確定是否添加或移除。 this.checked將是真或假;

如果您需要此網頁加載和運行只是觸發change當頁面加載：

$('input:radio').change(function(){ 

    $(this).parent().toggleClass('active', this.checked).siblings().removeClass('active'); 
}).change();