怎么让bootstrap的radio选中？

Question

Hi.我用bootstrap (.form-group)的radio.想通过jq来选中它．
我尝试使用了

$('#my_radio').prop('checked',true);
$('#my_radio').attr('class','active');
$('#my_radio').attr('checked','checked');

结果均无法选中！
我该怎么办？

---

补充：

这是在bootstrap自动生成的,普通radio（no bootstrap）以上都是可以选中的．就是对bootsp不起作用....我手动在radio上增加了checked，reload　page之后，是可以看见效果的．jq动态操作dom增加checked，则不行．

<span>
 <div class="iradio_minimal" aria-checked="false" aria-disabled="false" style="position: relative;"><input type="radio" name="selectType" value="css_url" id="radio_css_url" style="position: absolute; opacity: 0;"><ins class="iCheck-helper" style="position: absolute; top: 0%; left: 0%; display: block; width: 100%; height: 100%; margin: 0px; padding: 0px; border: 0px; opacity: 0; background: rgb(255, 255, 255);"></ins></div>
 </span>

Answer 1

只差最后一步 .prop('checked', 'checked')

补充

$('#my_radio') 应该是没选着上radio，应该是radio的父级之类的

Answer 2

bootstrap 的 radio这块是很坑爹的，你看到的其实是input的父元素span（bootstrap自己生成的）的样式（模拟的input，然后把真实的input覆盖了），所以input这块展示出来的选中状态其实是由span是否有checked类决定，而不是input本身.
知道原因了那好办，你得分两步去处理：

1、给要选中的input 父span加checked类, 这块还有个蛋疼的地方，它生成的radio的结构是.radio>span>input,也就是说input外面包了两层元素，你单给父span加checked类还不行，还得把其他span.checked的元素移除checked类，所以这里找起来也挺恶心的。

2、给input 设置checked属性。

$('input').prop('checked',true).parent('span').addClass('checked');

我这里也试过了 $(input).trigger('click'); 妈的，竟然不生效. 而且$('.radio').trigger('click')也不生效，不知道它怎么写的，懒得看它源码了。bootstrap这坑，简直了

Answer 3

首先 看下$('#my_radio') 是否能选中元素
再试下 $('#my_radio').click()

Answer 4

高版本的jq建议使用prop来操作布尔值类型的属性。

$('#my_radio').prop('checked',true);

这个实现选中应该是没问题的，你可以打印一下这个radio的属性。

---

动态操作不行的话，你应该在动态生成之后再操作，一开始没生成的时候你应该也获取不到吧。

Answer 5

radio的选中状态用：
$('#my_radio').get(0).checked = true;

我的理解是：用jQuery的prop()方法和attr()方法改变的是操作对象的【状态】，而要真正选中radio/checkbox，需要改变的是它们的【属性】，所以应该先用get()方法先获取dom元素。

参考：

jQuery DOM 元素方法 - get() 方法
jQuery函数attr()和prop()的区别

Answer 6

$('#my_radio').prop("checked", !$(this).prop("checked"));

Answer 7

抱歉，打错地方了，请忽略。