码迷,mamicode.com
首页 > Web开发 > 详细

HTML5 表单验证

时间:2016-05-15 20:05:09      阅读:233      评论:0      收藏:0      [点我收藏+]

标签:用户名   表达式   number   密码   html5   

==============================================

1.required --- 必填字段验证


2.minlength, maxlength --- 字符长度验证


3.min, max --- 数值范围验证  用于number,range 和日期时间类型


4.step --- 步长验证


5.pattern --- 正则表达式验证


6.novalidate(form中) ---禁用表单验证 

  formnovalidate(submit中) ---禁用表单验证 


<form action=" " method="post">

    <div>用户名:<input type="text" minlength="3" maxlength="10" required></div>

    <div>密码:<input type="password" minlength="6" maxlength="8" required></div>

    <div>邮箱:<input type="email" pattern=" ^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$" required></div>

    <div>日期:<input type="date" min="2016-02-05" max="2017-02-05" required> </div>

    <div>订购数量:<input type="number" min="10" max="50" step="5" required> </div>

    <div>音量:

        <form oninput="out.value=in.value">

            <input type="range" name="in" value="0">

            <output name="out">0</output>

        </form>

    </div>

    <input type="submit">

    </form>


HTML5 表单验证

标签:用户名   表达式   number   密码   html5   

原文地址:http://11562329.blog.51cto.com/11552329/1773578

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!