html中radio单选按钮控件标签⽤法解析及如何设置默认选中Radio 对象代表 HTML 表单中的单选按钮。在 HTML 表单中 <input type="radio"> 每出现⼀次，⼀个 Radio 对象就会被创建。单选按钮是表⽰⼀组互斥选项按钮中的⼀个。当⼀个按钮被选中，之前选中的按钮就变为⾮选中的。当单选按钮被选中或不选中时，该按钮就会触发onclick 事件句柄。您可通过遍历表单的 elements[] 数组来访问 Radio 对象，或者通过使⽤ ElementById()。由www.169it搜集整理
⼀、单选按钮控件语法
1<input name="Fruit" type="radio" value="" />
使⽤html input标签，name为⾃定义，type类型为“radio”的表单.
⼆、radio单选按钮代码举例
1、html代码⽚段：
1 2 3 4 5 6 7 8<form action="" method="get">
您最喜欢⽔果？<br /><br />
<label><input name="Fruit" type="radio" value="" />苹果 </label> <label><input name="Fruit" type="radio" value="" />桃⼦ </label> <label><input name="Fruit" type="radio" value="" />⾹蕉 </label> <label><input name="Fruit" type="radio" value="" />梨 </label> <label><input name="Fruit" type="radio" value="" />其它 </label> </form>
2.举例代码⽚段⼆(默认选中设置举例):
1 2 3<input type="radio" name="identity" value="学⽣" checked="checked" />学⽣<input type="radio" name="identity" value="教师" />教师
<input type="radio" name="identity" value="管理员" />管理员
在代码举例⼆种， checked="checked" 表⽰默认选中项设置。
3.代码举例三(js操作radio):
1
2 3 4 5 6 7 8 9 10 11 12 13 14 15 16<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk">
<script>
<!--
//选中2返回的也是1，到第⼀个ID为该值的DOM，弹出 1
function getVById(){ElementById('test11').value);}
function getVByName(){
var tt = ElementsByName('test11');
for (var iIndex = 0; iIndex < tt.length ; iIndex++ )
{
if(tt[iIndex].checked)
html radio选中事件
{
alert(tt[iIndex].value);
16 17 18 19 20 21 22 23 24 25 26 27 28 29 30                alert(tt[iIndex].value);
break;
}
}
};
-->
</script>
</head>
<body>
<input type="radio" id="test11" name="test11" value="1" />测试1
<input type="radio" id="test11" name="test11" value="2" />测试2
<input type="button" value="BTN_ByID" onclick="getVById()" />
<input type="button" value="BTN_ByName" onclick="getVByName()" /> </body>
<html>
⽂章来源:

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。