先看代码：

<!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. 在npm上如何发布自己的包

    环境需要:node和npm 然后在本地建一个文件夹作为你要发布的模块 然后在这个文件夹下打开cmd 执行:npm init 按照提示写对应的,或者先不写也可以,最后y 这时候在mcrm这个文件夹下就出 ...

  2. 解决：java.lang.ClassNotFoundException: org.apache.xmlbeans.XmlObject报错问题。

    利用POI操作PPT一直报如下错误java.lang.ClassNotFoundException: org.apache.xmlbeans.XmlObject 是因为项目中缺少一个包xmlbeans ...

  3. 165.扩展User模型-继承AbstractBaseUser

    继承自AbstractBaseUser模型 如果你想要修改默认的验证方式,并且对于User模型上的一些字段不想要,那么可以自定义一个模型,然后继承自AbstractBaseUser,再添加你想要的字段 ...

  4. AI赋能抗疫！顶象入选“中关村第二批抗疫新技术新产品新服务清单”

    新型冠状病毒疫情仍未到达拐点,要打赢这场疫情攻坚战,不仅需要全国人民共同努力,还要使用科技的手段,用科学来守护大家的安全.对病毒的识别需要运用生物学技术进行基因测序,病患需要依靠医学能力进行救治.与此 ...

  5. NotePad++中如何改变光标样式（转换横着和竖着）？

    在键盘上找 Insert ,按这个Insert就可以把横向闪烁光标( _ )修改成竖向闪烁光标样式( | )

  6. 图的最短路径算法-- Floyd算法

    Floyd算法求的是图的任意两点之间的最短距离 下面是Floyd算法的代码实现模板: ; ; // maxv为最大顶点数 int n, m; // n 为顶点数,m为边数 int dis[maxv][ ...

  7. Java连载83-单向链表、双向链表、collections常用方法

    一.单向链表 1.单向链表:每个元素都称为节点(Entry),每个节点都由两部分组成 2.单向链表的注意点: (1)单向链表每一个节点在内存中存储上在空间位置上是无规律的: (2)为什么单向链表的查询 ...

  8. I/O多路复用select/poll/epoll

    前言 早期操作系统通常将进程中可创建的线程数限制在一个较低的阈值,大约几百个.因此, 操作系统会提供一些高效的方法来实现多路IO,例如Unix的select和poll.现代操作系统中,线程数已经得到了 ...

  9. 字节流和字符流的read方法

    字节流和字符流的read方法 public class Test { public void fileOutput() throws Exception { File file = new File( ...

  10. php & c# DES

    php <?php class DES { var $key; var $iv; //偏移量 function DES($key = '11001100', $iv=0 ) { //key长度8 ...