之前我们判断用户提交的是否是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. 《C++程序设计》朝花夕拾

      (以后再也不用破Markdown写东西了,直到它有一个统一的标准,不然太乱了--) 函数签名 int f (int a, int b) ↑ ↑ ↑ ↑ 返回类型 函数名 形 式 参 数 其中,函数 ...

  2. Unity3D必备知识: 物理学公式

    一.质点的运动(1)——直线运动 1)匀变速直线运动 1.平均速度V＝s/t(定义式) 2.有用推论Vt*Vt-Vo*Vo＝2as 3.中间时刻速度Vt/2＝V平＝(Vt+Vo)/2 4.末速度Vt＝ ...

  3. win10 更新导致 VisualSVN 报0x80041024错错误

    主要是WMI丢失,重新注册下就好. 运行cmd.exe, 运行语句:mofcomp "%VISUALSVN_SERVER%WMI\VisualSVNServer.mof" 修复即可 ...

  4. iOS-tableView本地动画刷新

    比如:就拿删除tableView中一个Cell为例子. // XXXTableViewCellDelegate - (void)tapDeleteHelloUser:(CJHelloTableView ...

  5. LINQPad_批量修改图片名称

    用到这个工具是在后台批量修改图片名称的时候 下载并安装LINQPad. 这里要注意:在复制path路径的时候C:\xampp\htdocs\day01\angularjs_day01_am\angul ...

  6. python中的json和pickle

    author:headsen chen date::2018-04-10  09:56:54 json模块和pickle模块: 这是用于序列化的两个模块: 概念介绍:json和pickle模块是将数据 ...

  7. mac下面安装mysql

    参考http://www.cnblogs.com/lakeslove/p/6280404.html 关于msyql5.7,安装时最大的改变就是有了一个默认密码 我安装的是mysql-5.7.17-ma ...

  8. Oracle database精装版11gR2入门详细连接教程

    对于11g本身比较简单,适合学习者使用,对电脑要求相对较低. 自己一个人单机学习使用. 工具/原料   Oracle Database Express Edition 11g Release 2安装包 ...

  9. Share and NTFS Permission

    NTFS Permissions Share Permissions Share and NTFS Permission Similarities 共享权限和NTFS权限的相似性 Modifying ...

  10. event chrome firefox 获取点击对象的 id 类

    <!doctype html><html lang="en"><head> <meta charset="UTF-8" ...