javascript radio值获取代码
程序员文章站
2022-07-07 19:57:20
...
1，用js获取radio的值。
2，js选中radio
document.consumerform.consumer_sex[0].checked=true;
通过一个函数方便地取 Radio 选中值的情况，该程序适用于两个及以上的同名 Radio。但实际中，仅有一个 Radio 的情况也存在，于是我们得增强程序功能，使程序适用于一个及以上的同名 Radio。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>javascript 获取 radio 选中值-www.jbxue.com</title>
<script language="javascript" type="text/javascript">
//Copyright 2008
//By 小吴同学 QQ:100052800
//Date 2008-11-25
//$写法，用于获取元素ID名称
function $(id){return document.getElementById(id);}
//获取 radio 选中值
function GetValue(){
//获取 radio 所在容器名，根据容器名称搜索 radio 的标签 input
var radios = $("radios").getElementsByTagName("input");
//初始化对象
var grade = "";
//是否选中 radio,默认不选中，radio 可指定 checked="checked" 不受 flag 影响
var flag = false;
//根据容器中搜索到的 input 标签的个数（长度）进行遍历
for(var i=0;i<radios.length;i++){
//如果当前有选中
if(radios[i].checked == true){
//赋值
grade = radios[i].value;
//赋值
flag = true;
//结束循环
break;
}
}
//判断 radio 是否有选中
if(!flag){
alert("No choose");
return;
}else{
alert(grade);
}
}
</script>
</head>
<body style="font:12px 'Microsoft Sans Serif'">
<div id="radios">
<input name="radio" type="radio" value="1"/>1
<input name="radio" type="radio" value="2" />2
<input name="radio" type="radio" value="3" />3
<input name="radio" type="radio" value="4" />4
<input name="radio" type="radio" value="5" />5
<input name="button" type="button" value="GetValue" onclick="GetValue()"/>
</div>
</body>
</html>
2，js选中radio
document.consumerform.consumer_sex[0].checked=true;
通过一个函数方便地取 Radio 选中值的情况，该程序适用于两个及以上的同名 Radio。但实际中，仅有一个 Radio 的情况也存在，于是我们得增强程序功能，使程序适用于一个及以上的同名 Radio。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>读取 Radio 的值-www.jbxue.com</title>
</head>
<body>
<form id="form1" action="" method="">
<div><input type="radio" name="r" id="r1" value="一"><label for="r1">选项一</label></div>
<div><input type="button" value="检查选择项" onclick="javascript:Foo();"></div>
</form>
<script type="text/javascript" language="javascript">
<!--
function Foo()
{
var selectedIndex = -1;
var form1 = document.getElementById("form1");
var i = 0;
if (form1.r.value != undefined)
{
//只有一个 radio 的情况
if (form1.r.checked)
{
selectedIndex = 0;
alert("您选择项的 value 是：" + form1.r.value);
}
else
{
alert("您没有选择任何项");
}
return;
}
for (i=0; i<form1.r.length; i++)
{
if (form1.r[i].checked)
{
selectedIndex = i;
alert("您选择项的 value 是：" + form1.r[i].value);
break;
}
}
if (selectedIndex < 0)
{
alert("您没有选择任何项");
}
}
-->
</script>
</body>
</html>