twitter-bootstrap 使用 jquery 检查的 Bootstrap 设置单选按钮
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/28104723/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap set radio button checked with jquery
提问by Vijay Tambade
I have radio buttons in my html code. I want to change their state based on my input values via jquery
我的 html 代码中有单选按钮。我想通过 jquery 根据我的输入值更改它们的状态
Here is My Html
这是我的 HTML
<div class="col-md-2 col-xs-offset-1">
<div class="radio">
<label>
<input type="radio" name="rdo_pkdrop" value="0" id="rdo_pick">
Pick-up Time
</label>
</div>
<div class="radio">
<label>
<input type="radio" name="rdo_pkdrop" id="rdo_drop" value="1">
Drop Time
</label>
</div>
</div>
An jQuery is
一个 jQuery 是
if(qs_trip_type == 0){
$('#rdo_pick').prop('checked',true);
}else{
$('#rdo_pick').prop('checked',true);
}
But This has no effect
I also tried with
$('#rdo_pick').prop('checked','checked');and
但这没有效果我也试过
$('#rdo_pick').prop('checked','checked');和
$('#rdo_pick').attr('checked','true');
$('#rdo_pick').addClass('checked');
回答by lanternmarsh
This is only way I could find. Although somewhat inelegant, it does work.
这是我唯一能找到的方法。虽然有点不优雅，但它确实有效。
if(qs_trip_type == 0){
$('#rdo_pick').click();
}else{
$('#rdo_drop').click();
}
回答by Michbeckable
The issue with bootstrap is that you set a checked radio button by adding the activeclass to the corresponding label of the input. It looks like this:
bootstrap 的问题是您通过将active类添加到输入的相应标签来设置选中的单选按钮。它看起来像这样：
<label class="btn btn-default active"> <!-- Note the class 'active' here -->
<input type="radio" name="myRadio" value="value1" checked="checked"/>Value 1
</label>
<!-- ... -->
To check a radio button using jQuery you could first select the input field with a jQuery Selector and then add the class to the parent:
要使用 jQuery 检查单选按钮，您可以首先使用 jQuery Selector 选择输入字段，然后将类添加到父类：
var $myRadioInput = $(...);
$myRadioInput.parent('.btn').addClass('active');
Don't forget to remove the class activeon the formerly selected label with jQuery removeClass('active')to first unselect them.
不要忘记active使用 jQuery删除先前选择的标签上的类，removeClass('active')以首先取消选择它们。
I also like it to set the checkedproperty on the input itself to have the proper state on it:
我也喜欢checked在输入本身上设置属性以使其具有正确的状态：
$myRadioInput.prop('checked', true);
Note that the checked="checked"attribute is only the inital state for the input to be the checked input when loading the page. It does NOT change with the jQuery .prop()method, as it is an attribute and is different to the actual checked property. This is well described in jQuery Docs.
请注意，该checked="checked"属性仅是加载页面时输入为选中输入的初始状态。它不会随 jQuery.prop()方法而改变，因为它是一个属性并且与实际的checked property. 这在jQuery Docs 中有很好的描述。
回答by tdkman2010
I have tried，this code is ok for bootstrap radio.
我试过了，这个代码可以用于引导收音机。
if(qs_trip_type == 0){
$('#rdo_pick').prop('checked',true).click();
}else{ //not ekse
$('#rdo_pick').prop('checked',true).click();
}
回答by StateLess
there is a typo in your code replace eksewith else
您的代码中有一个错字替换ekse为else
if(qs_trip_type == 0){
$('#rdo_pick').prop('checked',true);
}else{
$('#rdo_pick').prop('checked',true);
}
回答by Arpit Srivastava
if(qs_trip_type == 0){
$('#rdo_pick').prop('checked',true);
}else{ //not ekse
$('#rdo_pick').prop('checked',true);
}
Here's the jsfidlle http://jsfiddle.net/urLh9qnh/
这是 jsfiddle http://jsfiddle.net/urLh9qnh/
回答by Sreelal P Mohan
Try this
试试这个
if(qs_trip_type == 0){
$('#rdo_pick').prop('checked',true);
}else{
$('#rdo_drop').prop('checked',true);
}
回答by Rashmy
Here is a one line solution:
这是一个单行解决方案：
$('#rdo_pick').iCheck('check');
回答by Alex Katanda
Try This: after setting the value of the radio, please add this code
试试这个：设置收音机的值后，请添加此代码
$("input[type='checkbox'], input[type='radio']").iCheck({
checkboxClass: 'icheckbox_minimal',
radioClass: 'iradio_minimal'
});
