zoukankan      html  css  js  c++  java
  • HTML5的表单新属性(扩展)

    新的 form 属性: autocomplete、 novalidate

     autocomplete控件是指用户在文本框输入前几个字母或是汉字的时候, autocomplete控件就能从存放数据的文本或是数据库里将所有以这些字母开头的数据提示给用户,供用户选择,提供方便。

    autocomplete 适用于 <form> 标签,以及以下类型的 <input> 标签:text, search, url, telephone, email, password, datepickers, range 以及 color。

    <form action="" method="post" enctype="" autocomplete="on">
    <label for="user">用户名:</label>
    <input type="text" name="user" id="user" >
    <input type="submit" name="" value="提交">
    
    </form>

     novalidate 属性的一个boolean 属性.

    novalidate 属性规定在提交表单时不应该验证 form 或 input 域。

    表单01 type类型email用了novalidate属性,提交表单时不需要验证则提交成功

    表单02 type类型email没用了novalidate属性,提交表单时需要验证。

    <!--表单01 用了novalidate属性-->
    <form name="form01" action="" method="post" enctype="" novalidate>
    E-mail01: <input type="email" name="email">
    <input type="submit" name="" value="提交">
    </form>
    
    <!--表单02 没用-->
    <form name="form02" action="" method="post" enctype="">
    E-mail02: <input type="email" name="email">
    <input type="submit" name="" value="提交">
    </form> 

    新的 input 属性:placeholder、autofocus、required等

    placeholder属性提供一种提示(hint),描述输入域所期待的值。

    简短的提示在用户输入值前会显示在输入域上。如图,灰色字体的请输入用户名...

    placeholder 属性适用于以下类型的 <input> 标签:text, search, url, telephone, email 以及 password。

    autofocus属性光标自动聚焦,当打开网页时光标就会自动聚焦到事先设定好autofocus属性的输入框哪里,如图,用户名的那个 |

    <form action="" method="post" enctype="" >
    <label for="user">用户名:</label>
    <input type="text" name="user" id="user" placeholder="请输入用户名..." autofocus ><br>
    <label for="password">密 码:</label>
    <input type="password" name="password" id="password" > <input type="submit" name="" value="提交">
    </form> 

    required 属性是一个 boolean 属性.

    required 属性规定必须在提交之前填写输入域(不能为空)。

    required 属性适用于以下类型的 <input> 标签:text, search, url, telephone, email, password, date pickers, number, checkbox, radio 以及 file。

    <form action="" method="post" enctype="" >
    <label for="user">用户名:</label>
    <input type="text" name="user" id="user" required><br>
    <label for="password">密 码:</label>
    <input type="password" name="password" id="password" > <input type="submit" name="" value="提交">
    </form> 

    html5新的 input 属性还有

    autocomplete、

    form、

    form overrides (formaction, formenctype, formmethod, formnovalidate, formtarget)、

    height 和 width、

    list 、

    min, max 和 step、

    multiple、

    pattern (regexp) 

  • 相关阅读:
    python 操作ie登陆土豆网
    python网络编程学习笔记(3):socket网络服务器
    python趣味编程:借书方案(排列组合)
    扑克牌洗牌
    C#开发的两个原则的深入讨论(转)
    软件文档知多少?(转)
    反射点滴Common
    使用ASP.NET加密口令(转)
    asp.net 备份和恢复SQL SERVER 数据库
    编程规范程序员们都应该这样写代码(转)
  • 原文地址:https://www.cnblogs.com/dadayang/p/5734939.html
Copyright © 2011-2022 走看看