<!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. Kubernetes-6.Service

    docker version:20.10.2 kubernetes version:1.20.1 本文概述Kubernetes Service的基本原理和使用. 服务 Service是将运行在一组Po ...

  2. javascript中的闭包closure详解

    目录 简介 函数中的函数 Closure闭包 使用闭包实现private方法 闭包的Scope Chain 闭包常见的问题 闭包性能的问题 总结 简介 闭包closure是javascript中一个非 ...

  3. 剑指 Offer 68 - I. 二叉搜索树的最近公共祖先 + 二叉排序树 + 最近公共祖先

    剑指 Offer 68 - I. 二叉搜索树的最近公共祖先 Offer_68_1 题目描述 方法一:迭代法 由于该题的二叉树属于排序二叉树,所以相对较简单. 只需要判断两个结点是否在根节点的左右子树中 ...

  4. HDU1067 Gap

    题目: Let's play a card game called Gap. You have 28 cards labeled with two-digit numbers. The first d ...

  5. Nginx常见的错误配置

    Blog:博客园 个人 翻译自Common Nginx misconfigurations that leave your web server open to attack Nginx是当前主流的W ...

  6. Shiro反序列化<=1.2.4 复现

    Apache Shiro是一个Java安全框架,执行身份验证.授权.密码和会话管理.    shiro默认使用了CookieRememberMeManager,其处理cookie的流程是:得到reme ...

  7. 关于主机不能访问虚拟机的web服务解决

    centos7默认并没有开启80端口,我们只有开启就行 [root@localhost sysconfig]# firewall-cmd --permanent --add-port=3032/tcp ...

  8. 如何下载Image Properties Context Menu（图片）插件

    如何下载Image Properties Context Menu(图片)插件 可以通过:http://www.cnplugins.com/zhuanti/four-image-processing. ...

  9. HDU_3746 Cyclic Nacklace 【KMP的应用】

    一.题目 HDU3746 二.分析 KMP比较好解决的一个问题:如果求一个串中的循环节? 仔细回想KMP的用法,重点是next数组,相当于就是后缀和前缀的比较,那么不正是方便了我们确定循环节? 如果以 ...

  10. golang 微服务以及相关web框架

    golang 中国gocn golang Applicable to all database connection pools xorm是一个简单而强大的Go语言ORM库,通过它可以使数据库操作非常 ...