jquery js radio单选框取值和赋值

分手后的思念是犯贱 2022-12-11 15:29 237阅读 0赞

今天下午遇到的坑，天大的坑啊，表单clear后，radio赋值无效。去除clear后却可。我用的以下方法尝试，都失败。最终问了项目经理，用末尾方法实现了。

以下方法

1.  `//取radio的值`
2.  `$("input[name='radioName'][checked]").val();`
3.  `//给radio 赋值, 选中值为2的radio：`
4.  `$("input[name='radioName'][value=2]").attr("checked",true);`

官方的方法是这样写：

1.  `//获取选中值，三种方法都可以：`
2.  `$('input:radio:checked').val()；`
3.  `$("input[type='radio']:checked").val();`
4.  `$("input[name='rd']:checked").val();`
5.  `//设置第一个Radio为选中值：`
6.  `$('input:radio:first').attr('checked', 'checked');`
7.  `//或者`
8.  `$('input:radio:first').attr('checked', 'true');`
9.  `//注：attr("checked",'checked')= attr("checked", 'true')= attr("checked", true)`
10. `//设置最后一个Radio为选中值：`
11. `$('input:radio:last').attr('checked', 'checked');`
12. `//或者`
13. `$('input:radio:last').attr('checked', 'true');`
14. `//根据索引值设置任意一个radio为选中值：`
15. `$('input:radio').eq(索引值).attr('checked', 'true');索引值=0,1,2....`
16. `//或者`
17. `$('input:radio').slice(1,2).attr('checked', 'true');`
18. `//根据Value值设置Radio为选中值`
19. `$("input:radio[value=http://www.2cto.com/kf/201110/'rd2']").attr('checked','true');`
20. `//或者`
21. `$("input[value=http://www.2cto.com/kf/201110/'rd2']").attr('checked','true');`
22. `//删除Value值为rd2的Radio`
23. `$("input:radio[value=http://www.2cto.com/kf/201110/'rd2']").remove();`
24. `//删除第几个Radio`
25. `$("input:radio").eq(索引值).remove();索引值=0,1,2....`
26. `如删除第3个Radio:$("input:radio").eq(2).remove();`
27. `//遍历Radio`
28. `$('input:radio').each(function(index,domEle){`
29. `//写入代码`
30. `});`

**此方法有效：**

1.  `$("input[name='GENDER'][value=" + object.GENDER + "]").prop("checked", "checked");//object..是请求得到的数据`
2.  `$("input[name='MARRIAGE'][value=" + object.MARRIAGE + "]").prop("checked", "checked");`
3.  `$("input[name='JOBTYPE'][value=" + object.JOBTYPE + "]").prop("checked", "checked");`

**总结：**

*  对于HTML元素本身就带有的固有属性，在处理时，使用prop方法。
 *  对于HTML元素我们自己自定义的DOM属性，在处理时，使用attr方法

举一个例子：

<input id="chk1" type="checkbox" />是否可见
    <input id="chk2" type="checkbox" checked="checked" />是否可见

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

$("#chk1").prop("checked") == false
    $("#chk2").prop("checked") == true

如果上面使用attr方法，则会出现：

$("#chk1").attr("checked") == undefined
    $("#chk2").attr("checked") == "checked"

二、

在编辑已有表单信息时，需要先对表单的值进行初始化，其他都比较容易直接通过.val()，单选略复杂，网上找的方法不太管用，可以试试如下方法，jQuery代码：

$("input\[name='sexy'\]").each(function(index, element) \{

if($(this).val()==json\_person.sexy)\{   
$(this).prop("checked",true);   
\}

\});

简单思路就是遍历每一项判断其value等于要设定的值则赋予checked属性。porp()和attr()详见另一篇文章：[http://blog.csdn.net/taijiedi13/article/details/37905471][http_blog.csdn.net_taijiedi13_article_details_37905471]。

[http_blog.csdn.net_taijiedi13_article_details_37905471]: http://blog.csdn.net/taijiedi13/article/details/37905471