html中单选按钮控件标签用法解析及如何设置默认选中

2019独角兽企业重金招聘Python工程师标准>>>

Radio 对象代表 HTML 表单中的单选按钮。在 HTML 表单中 每出现一次，一个 Radio 对象就会被创建。

单选按钮是表示一组互斥选项按钮中的一个。当一个按钮被选中，之前选中的按钮就变为非选中的。当单选按钮被选中或不选中时，该按钮就会触发 onclick 事件句柄。您可通过遍历表单的 elements[] 数组来访问 Radio 对象，或者通过使用 document.getElementById()。由www.169it.com搜集整理

一、单选按钮控件语法

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 17 18 19 20 21 22 23 24 25 26 27 28 29 30

< html > < head > < meta http-equiv = "Content-Type" content = "text/html; charset=gbk" > < script > script > < title >http://www.169it.com title > 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 >

• 文章来源:html中单选按钮控件标签用法解析及如何设置默认选中

转载于:https://my.oschina.net/u/1766067/blog/345522