HTML——input之单选按钮
在 HTML 中,把 <input> 标签的 type 属性设置为 radio 可以表示单选按钮。具体语法格式如下:
<input type="radio" />
例子:
<form action="http://vip.biancheng.net/login.php" method="post" name="formName">
性别:<input type="radio" name="sex" value="girl">女
<input type="radio" name="sex" value="boy" checked="checked">男
</form>

属性:
1、checked属性
checked 属性用来设置页面加载时单选按钮的选中状态。当属性值为“checked”时,单选按钮会被选中。
<form action="http://vip.biancheng.net/login.php" method="post" name="formName">
性别:<input type="radio" name="sex" checked>女
<input type="radio" name="sex" checked>男
</form>
注意:当 type 属性值为 radio 时,name 属性值必须保持一致。checked="checked"可以简写为 checked。
2、name属性
当 type 属性值为 radio 时,name 属性值必须保持一致。
3、value属性
<form action="http://vip.biancheng.net/login.php" method="post" name="formName">
性别:<input type="radio" name="sex" value="girl">女
<input type="radio" name="sex" value="boy" checked="checked">男
</form>

注意: 通过运行结果发现,value 值并不会显示在页面中。之所以建议为每个按钮添加 value 值,是因为最终提交表单时,服务器可以根据 value 属性值辨别提交的是哪一项。
HTML——input之单选按钮的更多相关文章
- HTML中获取input中单选按钮radio数据(性别例子)
个人学习整理 1.编写HTML <!doctype html> <html> <head> <meta charset="utf-8"&g ...
- angularjs—指令input
input[text] input一般和ngModel结合使用来实现双向绑定,同时angular提供了很多表单校验的指令 required 必填 ngRequired 必填(ngRequired可以控 ...
- HTML/CSS/JavaScript学习总结(转)
HTML 网站开发的主要原则是: – 用标签元素HTML描述网页的内容结构: – 用CSS描述网页的排版布局: – 用JavaScript描述网页的事件处理,即鼠标或键盘在网页元素上的动作后的程序 H ...
- 关于bootstrap--表单(下拉<select>、输入框<input>、文本域<textare>复选框<checkbox>和单选按钮<radio>)
html 里面的 role 本质上是增强语义性,当现有的HTML标签不能充分表达语义性的时候,就可以借助role来说明.通常这种情况出现在一些自定义的组件上,这样可增强组件的可访问性.可用性和可交互性 ...
- input 单选按钮radio 取消选中(转载)
input单选按钮: 在radio按钮中添加属性tag 0代表未被选中 HTML代码: <input name="rdo1" value="AA" ty ...
- 表单单选按钮input[type="radio"]
<!DOCTYPE html> <html lang="zh"> <head> <title></title> < ...
- 自定义常用input表单元素二:纯css实现自定义radio单选按钮
这是接着上一篇纯css自定义复选框checkbox的第二篇,自定义一个radio单选按钮,同样,采用css伪类和"+"css选择器为思路,下面是预览图: 下面直入主题放代码:HTM ...
- input 单选按钮radio 取消选中
//需要先引入JQ.js <input name="rdo" value="AA" type="radio" tag="0& ...
- jQ-多选按钮实现单选按钮的功能以及input按钮的优化
css: .displayN{display: none;} label {font-size:12px;cursor:pointer;} label i {font-size:12px;font-s ...
- <input type="radio">单选按钮
转自:http://www.divcss5.com/html/h490.shtml1 <form> 男性: <input type="radio" checked ...
随机推荐
- Hadoop之Hive架构与设计
Hadoop之Hive架构与设计 Hadoop是一个能够对大量数据进行分布式处理的软件框架.具有可靠.高效.可伸缩的特点. HDFS:全称为Hadoop分布式文件系统(Hadoop Distribut ...
- 结构化数据上的 TopN 运算
1. 最大值 / 最小值 最大值 / 最小值可以理解为 TopN 查询中,N 等于 1 时的情况,因为很常用所以单独拿出来讲一下.取最大值 / 最小值是很常见的需求,例如一班数学最高分是多少, ...
- 在Windows电脑上快速运行AI大语言模型-Llama3
概述 近期 Meta 发布了最新的 Llama3 模型,并开源了开源代码.Meta Llama 3 现已推出 8B 和 70B 预训练和指令调整版本,可支持广泛的应用程序. 并且 Llama 3 在语 ...
- 迁移 Nacos 和 ZooKeeper,有了新工具
简介: 注册中心迁移在行业中主要有两个方案,一个是双注册双订阅模式(类似数据库双写),一个是 Sync 模式(类似于数据库 DTS):MSE 同时支持了两种模式,对于开通 MSE 服务治理客户,MSE ...
- 庖丁解InnoDB之UNDO LOG
简介: Undo Log是InnoDB十分重要的组成部分,它的作用横贯InnoDB中两个最主要的部分,并发控制(Concurrency Control)和故障恢复(Crash Recovery),I ...
- [K8s] Kubernetes 集群部署管理方式对比, kops, kubeadm, kubespray
kops 是官方出的 Kubernetes Operations,生产级 K8s 的安装.升级和管理. 可以看做是适用于集群的 kubectl,kops 可帮助您从命令行创建,销毁,升级和维护生产级, ...
- WPF 项目文件不加 -windows 的引用 WPF 框架方式
默认情况下的 WPF 项目都是带 -windows 的 TargetFramework 方式,但有一些项目是不期望加上 -windows 做平台限制的,本文将介绍如何实现不添加 -windows 而引 ...
- c#胖东来小程序自动购物程序(接单,windows桌面程序、linux程序、网络应用等等)
一.程序效果 自动打开胖东来小程序,自动购物 二.实现 先截屏,然后利用opencv库识别下一步按键所在位置,然后使用mouse_event控制鼠标,模拟人的动作 第一步,截取屏幕 static Bi ...
- 简说Python之面向对象
目录 Python对象 对象的内置方法 __init__方法 __str__方法 对象的多态 对象的封装 对象的继承 之前介绍了函数.对象代表了什么.可以称为"一篮子"计划,把数据 ...
- Kubernetes(K8S)安装
Kubermetes (K8S) 安装 参考文档: 官方文档: https://kubernetes.io/zh-cn/docs/concepts/overview/components/#node- ...