之前我们判断用户提交的是否是Email 的时候，往往使用js 进行判断，但在html5中可以有新的方式进行判断而且更简单

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Email-Validator</title>

</head>

<body>

<form action="#">

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

    <button type="submit">submit</button>

    </form>

</body>

</html>

大家看效果

这是我们输入的不正确的电子邮件地址

他会自动进行向你提示

此外在input 的后面添加required就可以禁止填入的值为空了

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

效果如下：

html 5中的新特性之强化表单元素及属性的更多相关文章

  1. HTML5初步——新的表单元素和属性

    HTML5初步--新的表单元素和属性 HTML5初步--新的表单元素和属性 <!DOCTYPE html> <html> <head> <meta chars ...

  2. javascript总结39:DOM 中常用的表单元素的属性

    1 常用操作元素: value 用于大部分表单元素的内容获取(option除外) type 可以获取input标签的类型(输入框或复选框等) disabled 禁用属性 checked 复选框选中属性 ...

  3. 使用示例带你提前了解 Java 9 中的新特性

    使用示例带你提前了解 Java 9 中的新特性 转载来源:https://juejin.im/post/58c5e402128fe100603cc194 英文出处:https://www.journa ...

  4. ASP.NET 5与MVC 6中的新特性

    差点忘了提一句,MVC 6中默认的渲染引擎Razor也将得到更新,以支持C# 6中的新语法.而Razor中的新特性还不只这一点. 在某些情况下,直接在Web页面中嵌入某些JSON数据的方式可能比向服务 ...

  5. Webpack 3 中的新特性

    本文简短地分享下最新发布的 Webpack 3 中的新特性,供大家参考. 1. Webpack 3 的新特性 6 月 20 日,Webpack 发布了最新的 3.0 版本,并在 Medium 发布了公 ...

  6. HTML 5中的新特性

    HTML 5中的新特性 html5新增了一些语义化更好的标签元素.首先,让我们来了解一下HTML语义化. 1.什么是HTML语义化? 根据内容的结构化(内容语义化),选择合适的标签(代码语义化)便于开 ...

  7. （数据科学学习手札73）盘点pandas 1.0.0中的新特性

    本文对应脚本及数据已上传至我的Github仓库https://github.com/CNFeffery/DataScienceStudyNotes 1 简介 毫无疑问pandas已经成为基于Pytho ...

  8. 1 PHP 5.3中的新特性

    1 PHP 5.3中的新特性 1.1 支持命名空间 (Namespace) 毫无疑问,命名空间是PHP5.3所带来的最重要的新特性. 在PHP5.3中,则只需要指定不同的命名空间即可,命名空间的分隔符 ...

  9. Oracle11g新特性导致空表不能导出问题

        ORACLE 11G在用EXP导出时,发现空表(没有数据或者没有用过的表)不能导出了.     查了一下资料,说是Oracle 11G中有个新特性,当表无数据时,不分配segment,以节省空 ...

随机推荐

  1. Asp.net中使用文本框的值动态生成控件的方法

    这篇文章主要介绍了Asp.net中使用文本框的值动态生成控件的方法,非常不错,具有参考借鉴价值,需要的朋友可以参考下 看到一个网友,有论坛上问及,动态的生成checkbox控件,在文本框中输入一个“花 ...

  2. NYOJ 821 简单求值【简单题】

    /* 解题人:lingnichong 解题时间:2014.10.18   00:46 解题体会:简单题 */ 简单求值 时间限制:1000 ms  |  内存限制:65535 KB 难度:1 描写叙述 ...

  3. cocos3.9 windows平台 AssetsManager创建文件失败问题

    在做热更新功能时用到了AssetsManager,发现在windows平台总是报CREATE_FILE错误,errorStr "Can't renamefile from: xxx.tmp ...

  4. NHibernate VS IbatisNet

      NHibernate 是当前最流行的 Java O/R mapping 框架Hibernate 的移植版本,当前版本是 1.0 .2 .它出身于sf.net..IbatisNet 是另外一种优秀的 ...

  5. begin.BZOJ 1383: 三取方格数

    题目链接:传送门 题目大意:给你一个矩阵,每个格子有一个值,现在你要从左上角走到右下角(走3次),使得经过路径的权值和最大. 每个格子的值只能取一次,取完后变为0,输出走完三次后最大的权值和. 题目思 ...

  6. Jenkins publish over ssh 路劲配置问题 记录

    每次通过jenkins 实现  maven项目编辑后 自动通过 ssh发布到 服务器的功能时,对配置的路劲有疑问,特整理出来 前提:服务器路径   /home/ubuntu/aps 目标: 构建后的j ...

  7. git base 简单命令行

    记录几个简单的命令 1:克隆-把线上的文件复制到本地 git clone 线上地址 2:检查状态 git status 3:放入待仓储 git add.文件名 git add * (全部文件,简单粗暴 ...

  8. golang 开发过程中的坑

    1. chan数据读取写入 正常情况下chan读取写入都没有问题,但是如果chan关闭之后会出现问题 所以读取chan数据的时候需要增加chan是否关闭的判断 c := make(chan ) v, ...

  9. 网络编程3 网络编程之缓冲区&subprocess&粘包&粘包解决方案

    1.sub简单使用 2.粘包现象(1) 3.粘包现象(2) 4.粘包现象解决方案 5.struct学习 6.粘包现象升级版解决方案 7.打印进度条

  10. Windows如何使用Apache的ab工具进行网站性能测试（Apache服务器自带了ab压力测试工具，可以用来测试网站性能，使用简单方便）

    打开Apache服务器的安装路径,在bin目录中有一个ab.exe的可执行程序,就是我们要介绍的压力测试工具. 在Windows系统的命令行下,进入ab.exe程序所在目录,执行ab.exe程序.注意 ...