先看代码：

<!DOCTYPE html>

<html lang="en">

<head>

	<meta charset="UTF-8">

	<title>demo</title>

	<style>

		input[type="submit"]{

			width: 120px;

			height: 40px;

			border: 0;

			background-color: antiquewhite;

		}

		input[type="submit"]:hover{

			background-color: beige;

		}

	</style>

</head>

<body>

	<form action="#" method="post">

		<label><input type="radio" required />高中</label>

		<label><input type="radio" required />大专</label>

		<label><input type="radio" required />本科</label>

		<label><input type="radio" required />硕士研究生</label>

		<label><input type="radio" required />博士及以上</label>

		<br />

		<input type="submit" value="提交" />

	</form>

</body>

</html>

提交数据时并没有进行非空验证。

正确代码为：

<!DOCTYPE html>

<html lang="en">

<head>

	<meta charset="UTF-8">

	<title>demo</title>

	<style>

		input[type="submit"]{

			width: 120px;

			height: 40px;

			border: 0;

			background-color: antiquewhite;

		}

		input[type="submit"]:hover{

			background-color: beige;

		}

	</style>

</head>

<body>

	<form action="#" method="post">

		<label><input type="radio" name="q1" required />高中</label>

		<label><input type="radio" name="q1" required />大专</label>

		<label><input type="radio" name="q1" required />本科</label>

		<label><input type="radio" name="q1" required />硕士研究生</label>

		<label><input type="radio" name="q1" required />博士及以上</label>

		<br />

		<input type="submit" value="提交" />

	</form>

</body>

</html>

原因：

单项选择的实现是通过对多个单选按钮设置同样的name属性值和不同的选项值。例如，使用两个单选按钮，设置这两个控件的name值为sex，选项值一个为女，一个为男，从而实现从性别中选择一个的单选功能。

单选按钮有一个重要的属性checked，用来设置或返回单选按钮的状态。一组name值相同的单选按钮中，如果其中一个按钮的checked属性被设置为true，则其他按钮的checked属性值就默认为false。

单选按钮 设置required属性无法进行非空验证的更多相关文章

  1. JavaWeb 学习008-今日问题(非空验证尚未解决) 2016-12-2

    1. 学生模块list页面 不能正常跳转 说是找不到stuid属性,但是我在entity里面和数据库建表的属性就是stuid:Grade模块代码一样,却可以正常运行 这是什么问题? <c:for ...

  2. JS非空验证及邮箱验证

    非空验证 <body> <table> <tr> <td>姓名:</td> <td><input type="t ...

  3. Atitit  验证 数字验证 非空验证的最佳算法  h5

    Atitit  验证 数字验证 非空验证的最佳算法  h5 <td><select class="searchBox-select"   style=" ...

  4. JS-表单非空验证

    JavaScript 表单验证 JavaScript 可用来在数据被送往服务器前对 HTML 表单中的这些输入数据进行验证. 实例:1.用户名的非空验证代码如下: <head> <m ...

  5. select标签非空验证，第一个option value=""即可

    select标签非空验证,第一个option value=""即可,否则不能验证

  6. 非空验证（源代码Java版）

    import java.util.Map; /** * 非空验证工具类 */ public class UntilEmpty { /** * @see: 验证string类型的是否为空 */ publ ...

  7. php非空验证

    我想说这种方法是不是很常用的非空验证,现在的普遍使用的是javascript来验证非空,但是作为学习php的一些知识点,还是可以看看的. 先来看看commit.php中的方法 <?php $db ...

  8. .NET开源工作流RoadFlow-Bug修改-1.8.2表单验证时ueditor编辑非空验证无效

    RoadFlow生成的表单,Ueditor编辑器不能进行非空验证的BUG修改: 1.修改控制器:WorkFlowFormDesignerController红框处: 2.修改js文件:Scripts/ ...

  9. iview 表单非空验证

    rules: { title: [ {required: true, message: '请填写栏目名称', trigger: 'blur'} ], desc: [ {required: true, ...

随机推荐

  1. Cannot read property 'resolve' of undefined

    可能是node下载的有问题 推荐官网:https://nodejs.org/zh-cn/

  2. android TextView 支持长按自由复制

    因为EditText支持系统的长按自由复制,所以只需要把EditText通过配置达到TextView效果就行了 <EditText android:id="@+id/subject_i ...

  3. Selenium自动化发送163邮箱

    自动化发送163邮件 方法一: import time import datetime from selenium import webdriver from selenium.webdriver.s ...

  4. 神器扒网站——teleport ultra

    在平时的开发或者学习的过程中,我们难免会看到一些让人心动的网站,于是自己想把它搞下来,自己手工一个文件一个文件把它保存下来也可以实现,完成了也累得够呛,有一款扒站的神器,可以把你所喜欢的目标网站整个网 ...

  5. VS2017连接MySQL数据库

    vs默认无法直接连接mysql,需要我们自己配置环境. 1.下载mysql-installer-community-8.0.18.0.msi 下载地址:https://dev.mysql.com/do ...

  6. 计算a除b的第一位小数 in C++.

    my codes: #include<iostream> #include<cstdio> using namespace std; int main() { int a,b; ...

  7. CentOS 7升级gcc版本

    Centos 7默认gcc版本为4.8,有时需要更高版本的,这里以升级至8.3.1版本为例,分别执行下面三条命令即可,无需手动下载源码编译 1.安装centos-release-scl sudo yu ...

  8. MySql -- primary key主键约束

    4.primary key主键约束 在一张表中: 1) 主键约束是 NOT NULL.UNIQUE唯一的记录. 2) 主键约束必须是唯一的值. 3) 主键约束列不能包含 NULL 值. 注意:每个表都 ...

  9. oracle分组并在组内排序

    根据c1,c2分组,并且根据c3排序,取第一行select tt.*  from (select row_number() over(partition by c1, c2 order by c3 d ...

  10. 第三十六篇 入门机器学习——Jupyter Notebook中的魔法命令

        No.1.魔法命令的基本形式是:%命令   No.2.运行脚本文件的命令:%run %run 脚本文件的地址 %run C:\Users\Jie\Desktop\hello.py # 脚本一旦 ...