感觉最大的改变就是表单元素可以不写在form标签中。写在其他地方，加个form属性就能提交了
别的嘛感觉没什么，表单验证也不能提示信息，感觉不实用

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8" />

        <title></title>

    </head>

    <body>

        <h1>表单增强</h1>

        <form id="form1" action="index.html" method="post">

            <!--规定输入字段的值的模式或格式。传入一个正则-->

            <input type="text" pattern="[0-9]{11}" title="输入数字" placeholder="数字" />

            <!--required非空验证-->

            <input required="required" type="text" />

            <!--min最小值 max最大值-->

            <input type="number" min="10" max="100"  placeholder="数字10-100"/>

            <!--formation规定提交地址，覆盖form表单的action-->

            <input type="submit" value="提交" formaction="action1.html" />

            <!--规定提交方法，覆盖form表单的method属性-->

            <input type="submit" value="提交" formmethod="get" />

            <!--和target属性一个意思-->

            <input type="submit" value="提交" formtarget="_blank" />

        </form>

        <!--form属性，值是form表单的id，表示从属于这个表单，不用写在form标签内-->

        <input form="form1" type="text" value="" />

    </body>

</html>

HTML5表单增强的更多相关文章

  1. HTML5跨浏览器表单及HTML5表单的渐进增强

    HTML5跨浏览器表单 http://net.tutsplus.com/tutorials/html-css-techniques/how-to-build-cross-browser-html5-f ...

  2. 实现跨浏览器html5表单验证

    div:nth-of-type(odd){ float: left; clear: left; } .origin-effect > div:nth-of-type(even){ float: ...

  3. html5表单验证

    表单验证为终端用户检测无效的数据并标记这些错误,是一种用户体验的优化. 下面展现浏览器自带的验证功能也可在移动端中查看: HTML部分: <!DOCTYPE html> <html ...

  4. Ideal Forms – 帮助你建立响应式 HTML5 表单

    Ideal Forms 是建立和验证响应式 HTML5 表单的终极框架.它刚刚发布 V3 版本,更小,更快,更具可扩展性.它支持实时验证,完全自适应(适应容器,没有 CSS 媒体查询需要),键盘支持, ...

  5. HTML5学习总结-05 HTML5表单

    一 HTML5 新的类型 HTML5 拥有多个新的表单输入类型.这些新特性提供了更好的输入控制和验证. email url number range Date pickers (date, month ...

  6. html5 表单样式 表单验证1 2 3

    html5 表单样式 ie9以下不支持 <!DOCTYPE html> <html lang="en"> <head> <meta cha ...

  7. HTML5表单提交和PHP环境搭建

    HTML5表单提交相关内容和PHP环境搭建需要的软件(只备注) (2)举例介绍 (3)PHP环境搭建

  8. HTML5表单及其验证

    随笔- 15 文章- 1 评论- 115 HTML5表单及其验证   HTML表单一直都是Web的核心技术之一,有了它我们才能在Web上进行各种各样的应用.HTML5 Forms新增了许多新控件及其A ...

  9. HTML5表单新属性

    HTML5表单新属性 autofocus  自动聚焦 <input type="text" autofocus> placeholder占位文本 tel         ...

随机推荐

  1. wordpress参考网站

    wordpress大学http://www.wpdaxue.com/post-tags-and-categories-for-pages.html

  2. Another attempt about LSI

    Last week I was here Natural Language Processing in NZ. Someone asked a question, is there any exist ...

  3. 依赖注入及AOP简述（五）——依赖注入的方式 .

    二.依赖注入的应用模式 前面我们了解了依赖注入的基本概念,也对一些依赖注入框架进行了简单的介绍,这一章我们主要来讨论作为开发者如何利用依赖注入框架来实现依赖注入的设计思想. 1.     依赖注入的方 ...

  4. 图的邻接表存储 c实现

    图的邻接表存储 c实现 (转载) 用到的数据结构是 一个是顶点表,包括顶点和指向下一个邻接点的指针 一个是边表, 数据结构跟顶点不同,存储的是顶点的序号,和指向下一个的指针 刚开始的时候把顶点表初始化 ...

  5. 【线段树求最靠前】【HDU2795】【Billboard】

    题意: 有一个H*W的广告牌,当插入一个广告时(1*Wi),问最靠前的插入方式是什么 新生赛有个类似的题目,可惜当时居然没水过去. 果断用线段树做 以H为线段 建树,存[l,r]中最大的宽度,因为区间 ...

  6. JavaScript 【跨浏览器处理XML，做个兼容】

    //兼容方法        function getXMLDOM(xmlStr) {            var xmlDom = null;            if (typeof windo ...

  7. week 与 strong区别 精辟的解释

    转:http://stackoverflow.com/questions/9262535/explanation-of-strong-and-weak-storage-in-ios5 觉得讲的很容易理 ...

  8. Spring IOC的配置使用（转）

    转:http://www.cnblogs.com/linjiqin/p/3408306.html Spring IOC的配置使用 1.1.1 XML配置的结构一般配置文件结构如下: <beans ...

  9. winform使用xml作为数据源

    1.新建窗体应用程序 2.拖放DataGridView 3.在bin\Debug中放入XML文件 using System; using System.Collections.Generic; usi ...

  10. BZOJ 3233: [Ahoi2013]找硬币( dp )

    dp(x)表示最大面值为x时需要的最少硬币数. 枚举x的质因数p,  dp(x) = min( dp(x/p) - (p-1) * sigma[a[i]/x] ). ----------------- ...