感觉最大的改变就是表单元素可以不写在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. JIRA官方：JIRA亮点介绍

    操作超级简单 简单不意味着要以牺牲功能作为代价.JIRA提供了友好.直观的可配置的Web界面,并支持大量的快捷键操作. 跟踪任何事务 跟踪问题.任务.需求,当然还有软件缺陷.定义你自己的事务类型来使之 ...

  2. python之花瓣美女下载

    python之花瓣美女下载 作者:vpoet mail:vpoet_sir@163.com 注:代码随意copy 不用告诉我 主要功能:     1.搜索花瓣http://huaban.com/下的图 ...

  3. UML_部署图

    一.部署图简介(Deployment Diagram Introduction) 二.部署图元素(Deployment Diagram Elements) 1.结点(Node) 2.结点实例(Node ...

  4. [置顶] ASP.Net中服务器控件的生命周期

    (1)初始化:在此阶段中,主要完成两项工作:一.初始化在传入Web请求生命周期内所需的设置;二.跟踪视图状态.首先,页面框架通过默认方式引发Init事件,并调用OnInit()方法,控件开发人员可以重 ...

  5. [转！]jQuey中的return false作用是什么

    jQuey中的return false作用是什么: 在众多的语句中都有return false的使用,当然对于熟悉它的开发者来说,当然是知根知底,知道此语句的作用,当然也就知道在什么时候使用此语句,不 ...

  6. mysql中limit用法误区

    之前一直用oracle,在分页的时候用rownumber,转换到mysql上之后,用limit做分页: 在做某个业务的时候,需要先将数据排序,再分页,在给limit上参数的时候沿用了oracle的ro ...

  7. 深入浅出CChart 每日一课——第十六课 实习之旅，百年老店之新锐WTL

    上节课笨笨给大家介绍了CChart在微软MFC框架下的应用,本节课的内容仍然和百年老店微软相关,只不过主角换成WTL了. 不了解WTL的同学可以先找度娘温习一下.度娘在怀,今生何求.郎君啊,你是不是闷 ...

  8. vim 多窗口编辑

    本文出自   http://blog.csdn.net/shuangde800 ------------------------------------------------------------ ...

  9. 20个热门jQuery的提示和技巧

    以下是一些非常有用的jQuery提示和所有jQuery的开发技巧. 1.优化性能复杂的选择 查询DOM中的一个子集,使用复杂的选择时,大幅提高了性能: var subset = $("&qu ...

  10. 献给写作者的 Markdown 新手指南

    「简书」作为一款「写作软件」在诞生之初就支持了 Markdown,Markdown 是一种「电子邮件」风格的「标记语言」,我们强烈推荐所有写作者学习和掌握该语言.为什么?可以参考: 『为什么作家应该用 ...