<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8" />

    <title></title>

</head>

<body>

    <form onsubmit="testform()" novalidate="true">

        <label for="email"> 邮箱：</label>

        <input type="email" id="email" name="email" />

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

    </form>

</body>

<script>

    function testform() {

        var email = document.getElementById('email');

        if (email.value == '') {

            alert('请输入email！');

            return false;

        } else if (!email.checkValidity()) {

            alert('email的格式不正确！');

            return false;

        }

    }

</script>

</html>

兼容到IE10及以上

required 等属性也适用

input 的各种属性的验证 checkValidity兼容性的更多相关文章

  1. js进阶正则表达式14验证邮编（input的pattern属性）（正则表达式加起^始$）

    js进阶正则表达式14验证邮编(input的pattern属性)(正则表达式加起^始$) 一.总结 1.input的pattern属性:里面可以直接放正则表达式,<input type=&quo ...

  2. 表单input按钮在各浏览器之间的兼容性

    从网上看了这篇关于表单input按钮的浏览器兼容性问题,总结的还不错,所以copy下来学习下. input按钮在各个浏览器之间的兼容性问题,看下边这段代码: input.item { backgrou ...

  3. 玩转html5(一)-----盘点html5新增的那些酷酷的input类型和属性

    今天正式开始学习html5了,相比html以前的版本,html5新增了好多功能,属性,使我们做出来的界面更加的绚丽,而且使用起来超级简单,这篇文章先来说说html增加的那些input类型和属性. 这些 ...

  4. mvc中动态给一个Model类的属性设置验证

    原文:mvc中动态给一个Model类的属性设置验证 在mvc中有自带的验证机制,比如如果某个字段的类型是数字或者日期,那么用户在输入汉字或者英文字符时,那么编译器会自动验证并提示用户格式不正确,不过这 ...

  5. input type类型和input表单属性

    一.input type类型 1.Input 类型 - email 在提交表单时,会自动验证 email 域的值. E-mail: <input type="email" n ...

  6. ie8下修改input的type属性报错

    摘要: 现在有一个需求如图所示,当用户勾选显示明文复选框时,要以明文显示用户输入的密码,去掉勾选时要变回密文,刚开始想到的就是修改输入框的type来决定显示明文还是密文,使用jQuery的attr来做 ...

  7. 前端福利之表单input按钮在各浏览器之间的兼容性(转)

    从网上看了这篇关于表单input按钮的浏览器兼容性问题,总结的还不错,所以copy下来学习下. input按钮在各个浏览器之间的兼容性问题,看下边这段代码: input.item { backgrou ...

  8. html5中 input的pattern属性 和 details/summary元素

    html5--3.21 课程小结与其他新增元素 一.总结 一句话总结: input的pattern属性可以设置正则验证,比如检测学号的位数和数字区间 details/summary元素配合起来可以做元 ...

  9. jquery取<input>的readOnly属性，O要大写

    今天在jquery中取input的readonly属性时,发现 我这样写$(“#input”).readonly取这个属性时,总是undefined,后来一想,难道html中的属性only没有大写,是 ...

随机推荐

  1. Hive 填坑指南

    Hive 填坑指南 目录 Hive 填坑指南 数据表备份 数据表备份 方法1:create table 表名_new as select * from 原表 create table 表名_new a ...

  2. Linux磁盘分区格式化和扩容

    Note:根据各系统上磁盘的类型不同,磁盘命名规则也会不同:例如/dev/xvd,/dev/sd,/dev/vd,/dev/hd 目录 磁盘格式化 MBR格式 GPT分区 磁盘扩容 MBR格式扩容 G ...

  3. STM32学习笔记——序言

    写AVR已经两年了.如果初中时候玩Arduino也算的话,就是6年. 两年以来,我用AVR单片机完成了两个大项目: AVR单片机教程,一时兴起写的,效果不好: MEDS,参赛用的课题,半完成,比赛都结 ...

  4. 后端程序员之路 41、BlockingQueue

    BlockingQueue,阻塞队列,常用于实现生产者和消费者模型特点:1.队列为空时,取操作会等到队列有数据2.队列满时,存操作会等到队列可用 基于C++11的阻塞队列简单实现 - Cynric 的 ...

  5. 关于VsCode创建Vue基础项目的步骤以及相关问题

    项目创建步骤: 1.  全局安装vue-cli 安装命令: npm install -g vue-cli 在vscode上打开一个终端,然后输入此命令(下为截图): 2. 安装webpack,打包js ...

  6. FutureTask源码分析（JDK7）

    总览 A cancellable asynchronous computation. This class provides a base implementation of {@link Futur ...

  7. HDOJ-6621(线段树+二分法)

    K-th Closest Distance HDOJ-6621 本题可以使用线段树解决,结点存本结点对应的所有元素,并按照从小打到排序 最后使用二分法求解答案.因为题目中有绝对值,所以需要使用两次查找 ...

  8. struts2.0中ognl栈的解析

    ongl详解: ValueStack是Struts2的一个接口,字面意义为值栈,OgnlValueStack是 ValueStack的实现类,客 户端发起一个请求,struts2架构会创建一个acti ...

  9. vue 树形数据增加属性并计算树节点的深度

    需求:在一组菜单树结构中转换数据结构(增加一些属性),并计算该树结构的节点深度. 实现util.js: function transferTreeData(arr, vm, list, level, ...

  10. SQL排名问题，100% leetcode答案大公开！

    (首先原谅我最近新番看多了,起了一个中二的名字) 最近在找实习,所以打算系统总结(复习)一下sql中经常遇到问题.不管是刷leetcode还是牛客的sql题,有一个问题总是绕不开的,那就是排名问题.其 ...