您的位置:首页 > 产品设计 > UI/UE

JS根据value的值动态选择

2017-08-29 15:09 204 查看
<div class="form-group">
<label for="inputEmail3" class="col-sm-2 control-label" style="padding-top:0;">收款账户类型</label>
<div class="col-sm-5">
<div class="radio select-width">
<label>
<input name="radioAccountType"  id="radioAccountType_0" value="0" checked="" type="radio">对私账户
</label>
</div>
<div class="radio select-width">
<label>
<input name="radioAccountType"   id="radioAccountType_1"  value="1" checked="" type="radio">对公账户
</label>
</div>
</div>
</div>

value = 该值为radio的动态需要设置选中的值//

如果采用这种方法,
$("input[type=radio][name=radioAccountType][value='"+value+"']").attr("checked",true);
第一次确实是可以选中,但是当两个选中相互切换的时候就会出现即使你设置了attr("checked",false)会失效的情况

正确方式:
if(value == '1'){
$('#radioAccountType_1').prop("checked", "checked");
$('#radioAccountType_0').prop("checked", "");
}else if(value == '0'){
$('#radioAccountType_1').prop("checked", "");
$('#radioAccountType_0').prop("checked", "checked");
}

必须使用prop,不能使用attr属性否则不能成功。对于这种像checkbox,radio和select这样的元素,选中属性对应“checked”和“selected”,这些也属于固有属性,因此需要使用prop方法去操作才能获得正确的结果。

注意:
在编辑按钮radio时,要注意name属性的值一定要相同;
初始化让单选框选中有4种方法可以实现:
1、checked
2、checked='checked'(建议用此方法,此方法对浏览器可以有很好的兼容性)
3、checked='true'
4、checked=true
小提示:通过给checked属性赋值,只要checked存在,
赋予任何值都可以初始化选中(eg:checked='aaa' 或 checked='false')不赋值都可以实现初始化选中
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: