引导设置单选按钮与 jquery 一起检查

Bootstrap set radio button checked with jquery

本文关键字：jquery 一起 检查 单选按钮 设置      更新时间：2023-09-26

我的html代码中有单选按钮。我想通过 jquery 根据我的输入值更改他们的状态

这是我的网页

<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>

一个jQuery是

if(qs_trip_type == 0){
   $('#rdo_pick').prop('checked',true); 
}else{
   $('#rdo_pick').prop('checked',true); 
}

但这没有效果我也尝试过 $('#rdo_pick').prop('checked','checked');和

$('#rdo_pick').attr('checked','true'); 
  $('#rdo_pick').addClass('checked');
这是我

能找到的唯一方法。虽然有些不优雅，但它确实有效。

if(qs_trip_type == 0){
  $('#rdo_pick').click(); 
}else{
  $('#rdo_drop').click(); 
}

引导程序的问题在于，通过将active类添加到输入的相应标签来设置选中的单选按钮。它看起来像这样：

<label class="btn btn-default active">    <!-- Note the class 'active' here -->
    <input type="radio" name="myRadio" value="value1" checked="checked"/>Value 1
</label>
<!-- ... -->

要使用 jQuery 检查单选按钮，您可以先使用 jQuery 选择器选择输入字段，然后将类添加到父级：

var $myRadioInput = $(...);
$myRadioInput.parent('.btn').addClass('active');

不要忘记使用 jQuery removeClass('active')删除以前选择的标签上的类active，以首先取消选择它们。

我也喜欢在输入本身上设置 checked 属性以使其具有正确的状态：

$myRadioInput.prop('checked', true);

请注意，checked="checked" 属性只是加载页面时输入的初始状态，该输入是选中的输入。它不会随 jQuery .prop() 方法而改变，因为它是一个属性并且与实际checked property不同。这在jQuery Docs中有很好的描述。

我已经尝试过了，这段代码对于引导无线电是可以的。

if(qs_trip_type == 0){
   $('#rdo_pick').prop('checked',true).click();
}else{ //not ekse
   $('#rdo_pick').prop('checked',true).click();
}

代码中有一个拼写错误，将ekse替换为else 

   if(qs_trip_type == 0){
       $('#rdo_pick').prop('checked',true); 
    }else{
       $('#rdo_pick').prop('checked',true); 
    }

if(qs_trip_type == 0){
   $('#rdo_pick').prop('checked',true); 
}else{ //not ekse
   $('#rdo_pick').prop('checked',true); 
}

这是 jsfidlle http://jsfiddle.net/urLh9qnh/

试试这个

if(qs_trip_type == 0){
   $('#rdo_pick').prop('checked',true); 
}else{
   $('#rdo_drop').prop('checked',true); 
}

试试这个：设置收音机的值后，请添加此代码

$("input[type='checkbox'], input[type='radio']").iCheck({
    checkboxClass: 'icheckbox_minimal',
    radioClass: 'iradio_minimal'
});

这是一个单行解决方案：

$('#rdo_pick').iCheck('check');
相关文章：