radio和checkbox还有select，可谓是前后端常用三剑客啊！特别是checkbox和select，关于这两个今天不讲，因为在下面这几篇文章，我已经比较详细的讲解了。
SpringMVC之ajax+select下拉框交互常用方式
checkbox选中并通过ajax传数组到后台接收
关于checkbox自动选中
今天主要讲解的是radio。
radio应用，主要应用是单选框，实际应用也很广，比如性别、身份认证(企业或者个人)、状态等等。
还是老规矩，代码实例讲解。
1.如何获得radio的值？
var isDefaultPlan = $("input[name=‘isDefaultPlan‘]:checked").val();通过上述代码就可以获得选中radio的值
2.radio如何赋值并选中?
if(data.resourceRatePlan.isDefault==1){ ???????????????$(‘input:radio[name=isDefaultPlan][value="1"]‘).attr("checked",true); ???????????????????????????????}else{ ???????????????$(‘input:radio[name=isDefaultPlan][value="0"]‘).attr("checked",true); ???????????????????????????} ???????????????????????//当status的值为1时,相当于是关闭状态 ???????????if(data.resourceRatePlan.status==1){ ???????????????????????????????$(‘input:radio[name=status][value="1"]‘).attr("checked",true); ???????????????????????????}else{ ???????????????$(‘input:radio[name=status][value="0"]‘).attr("checked",true); ???????????????????????????}上述代码即可实现
实际用途比较多的主要是取值和赋值。
从上面两个例子可以得出一个结论，就是都是通过jQuery选择器或者相关js判断来达到取值和赋值的目的。
jQuery本身就是js的封装。jQuery的宗旨，一直以来不变，就是那一句话:写的更少，做的更多。
jQuery教程可以参考:https://www.runoob.com/jquery/jquery-tutorial.html
另外我通常写博文也比较喜欢强调基础和原理。
下面进入，不用jQuery实现获取radio值，js和html代码示例如下:
<html> ???????<head> ???????<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> ???????<title>test</title> ???????<script> ?????????????function check_radio(){ ???????????????var chkObjs = document.getElementsByName("radio"); ???????????????for(var i=0;i<chkObjs.length;i++){ ???????????????????if(chkObjs[i].checked){ ??????????????????????alert(chkObjs[i].value); ???????????????????????????break; ???????????????????????} ???????????????????} ???????????????????????????} ???????</script> ???</head> ???<body> ???????<form action=‘‘ method=‘post‘ onsubmit=‘javascript:return check_radio()‘> ???????????<input type=‘radio‘ value=‘1‘ name=‘radio‘>A ???????????<input type=‘radio‘ value=‘2‘ name=‘radio‘>B ???????????<input type=‘radio‘ value=‘3‘ name=‘radio‘>C ???????????<input type=‘radio‘ value=‘4‘ name=‘radio‘>D ???????????<input type=‘radio‘ value=‘5‘ name=‘radio‘>E ???????????<input type=submit value=sub > ???????</form> ???</body></html>小结:领悟好javascript,对于jQuery将会更好的理解，或许以后就可以像贤心同志那样，写一个layui前端框架。当然了框架也不是那么好写，不过框架的本质就是那些基础的升级版。
js之radio应用实例
原文地址：https://www.cnblogs.com/youcong/p/9337804.html