阿西河

所有教程

公众号
🌙
阿西河前端的公众号

我的收藏

    最近访问  (文章)

    教程列表

    数据库
    抓包专区
    测试专区

    HTML5 引入什么新的表单属性

    <form>新属性

    autocomplete

    属性规定表单是否应该启用自动完成功能。

    autocomplete 属性适用于 <form>,以及下面的 <input> 类型:

    text, search, url, telephone, email, password, date,pickers, range 以及 color。

    语法是<form autocomplete="on|off">

    novalidate

    如果使用该属性,则提交表单时不进行内容的验证。

    novalidate 属性适用于:<form>,以及以下类型的 <input> 标签:

    text, search, url, telephone, email, password, date pickers, range 以及 color。

    语法:novalidate="novalidate"

    <input>新属性

    autocomplete

    同上;

    演示

    autofocus

    规定输入字段在页面加载时是否获得焦点,加载完成后,光标马上定位在该 input;

    (不适用于 type=“hidden”)语法:autofocus=“autofocus”;

    或者写一个 autofocus 也可以的;

    form

    form 属性的值必须是其所属表单的 id。

    如需引用一个以上的表单,请使用空格分隔的列表。

    formaction

    属性覆盖 form 元素的 action 属性,比如两个提交按钮的时候,一个是正常提交,一个是管理员提交。该属性适用于 type=“submit” 以及 type=“image”。

    语法是 formaction="#"

    formenctype

    formenctype 属性覆盖 form 元素的 enctype 属性。

    该属性与 type=“submit” 和 type=“image” 配合使用。

    属性规定在发送到服务器之前应该如何对表单数据进行编码。

    formmethod

    覆盖表单的 method 属性。

    适用于 type=“submit” 和 type=“image”

    formnovalidate

    formnovalidate 属性覆盖 form 元素的 novalidate 属性。

    如果使用该属性,则提交表单时按钮不会执行验证过程。

    formtarget

    覆盖表单的 target 属性。

    适用于 type=“submit” 和 type=“image”, 该属性规定在何处打开 action URL。

    height 和 width

    height 和 width 属性规定用于 image 类型的 <input> 标签的图像高度和宽度。

    list

    引用包含输入字段的预定义选项的 datalist 。

    <form action="#">
        选择网址
        <input type="url" list="url_list_broszhu" name="link" />
        <datalist id="url_list_broszhu">
            <option label="百度" value="http://www.baidu.com"></option>
            <option label="谷歌" value="http://www.google.com"></option>
            <option label="微软" value="http://www.microsoft.com"></option>
            <option label="阿西河前端教程" value="https://www.axihe.com/"></option>
        </datalist>
        <input type="submit"/>
    </form>
    
    
    选择网址

    min 和 max

    min 属性与 max 属性配合使用,可创建合法值范围,两个要一对用。

    语法是 选择 0-10 数字:<input type="number" name="points" min="0" max="10" />

    multiple

    如果使用该属性,则允许一个以上的值,比如上传文件的时候,设置这个属性后可以一次选择几个图片;

    multiple 属性适用于以下类型的 <input> 标签:email 和 file。

    pattern (regexp)

    描述了一个正则表达式用于验证 <input> 元素的值;注释:pattern 属性适用于以下 <input> 类型:text, search, url, telephone, email 以及 password 。

    提示:请使用标准的 “title” 属性来描述模式。

    placeholder

    提供可描述输入字段预期值的提示信息(hint)。

    该提示会在输入字段为空时显示,并会在字段获得焦点时消失。

    required

    规定必需在提交之前填写输入字段。 如果使用该属性,则字段是必填(或必选)的。

    step

    为输入域规定合法的数字间隔。 如果 step=“3”,则合法的数是 -3,0,3,6 等

    提示: step 属性可以与 max 和 min 属性创建一个区域值。

    更多参考

    上面知识点的详细介绍,可以在 HTML5 表单属性 查看,

    还有一个 HTML5 新的 Input 类型也建议了解一下

    更多面试题

    如果你想了解更多的前端面试题,可以查看本站的WEB前端面试题 ,这里基本包涵了市场上的所有前端方面的面试题,也有一些大公司的面试图,可以让你面试更加顺利。

    面试题
    HTML CSS JavaScript
    jQuery Vue.js React
    算法 HTTP Babel
    BootStrap Electron Gulp
    Node.js 前端经验相关 前端综合
    Webpack 微信小程序 -

    这些题库还在更新中,如果你有不错的面试题库欢迎分享给我,我整理后放上来;人人为我,我为人人,互帮互助,共同提高,祝大家都拿到心仪的Offer!

    卖前端学习教程

    只需几十元,就能买到培训班的内部教程!开启高薪之路!

    零基础小白阿里P7的教程都有!

    同时长期收购所有培训班的前端教程

    目录
    目录