怎么让bootstrap的radio选中?
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>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(7)
只差最后一步
.prop('checked', 'checked')
补充
$('#my_radio')
应该是没选着上radio,应该是radio的父级之类的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).trigger('click');
妈的,竟然不生效. 而且$('.radio').trigger('click')
也不生效,不知道它怎么写的,懒得看它源码了。bootstrap这坑,简直了首先 看下$('#my_radio') 是否能选中元素
再试下 $('#my_radio').click()
高版本的jq建议使用prop来操作布尔值类型的属性。
这个实现选中应该是没问题的,你可以打印一下这个radio的属性。
动态操作不行的话,你应该在动态生成之后再操作,一开始没生成的时候你应该也获取不到吧。
radio的选中状态用:
$('#my_radio').get(0).checked = true;
我的理解是:用jQuery的prop()方法和attr()方法改变的是操作对象的【状态】,而要真正选中radio/checkbox,需要改变的是它们的【属性】,所以应该先用get()方法先获取dom元素。
参考:
抱歉,打错地方了,请忽略。