這是將單選按鈕設置爲在Bootstrap中「檢查」的正確方法嗎？

Question

我將TIMEX的問題重新標記爲重複，因爲我認爲它不是重複的，而且我遇到了同樣的問題。

How do I set the radio button to "checked" in Bootstrap?

我使用引導按鈕作爲單選按鈕。 http://getbootstrap.com/javascript/#buttons

這是我當前的代碼：

<div class="btn-group col-md-2" data-toggle="buttons"> 
    <label class="btn btn-gender btn-default active"> 
     <input type="radio" id="gender" name="gender" value="female"> Girls 
    </label> 
    <label class="btn btn-gender btn-default"> 
     <input type="radio" id="gender" name="gender" value="male"> Guys 
    </label> 
</div> 

如何設置 「男性」，以使用JavaScript檢查？

這裏是我的問題的再現： https://jsfiddle.net/JonathanN/ba7d24k3/

我找不到getbootstrap.com文檔或容易計算器上的解決方案，所以這裏就是我想出了： https://jsfiddle.net/JonathanN/ba7d24k3/2/

var toggleRadioButton = function ($parent, name, value) { 
    var $allButtons = $parent.find('input[name="' + name + '"]'); 
    $allButtons.prop('checked', false); 
    $allButtons.parents('label.btn').removeClass('active'); 
    var $targetButton = $parent.find('input[name="' + name + '"][value="' + value + '"]'); 
    $targetButton.prop('checked', true); 
    $targetButton.parents('label.btn').addClass('active'); 
}; 

我使用jQuery，但它也可以用更冗長的JavaScript編碼。希望我已經確定，這不是基本如何設置與javascript問題的單選按鈕的副本。

我的問題：有沒有更簡單的方法？

Answer 1

如果你不喜歡

$parent.find('input[name="' + name + '"][value="' + value + '"]').click();

什麼觸發你想選擇的無論哪個無線電選項的點擊事件？這種引導程序可以處理所有的CSS類更改等。

Answer 2

找出一個引導方式來做到這一點。

$('#genderM').parents('.btn').button('toggle'); 

https://jsfiddle.net/JonathanN/ba7d24k3/5/