HTML5验证以及日期显示的实现详解
导读：收集整理的这篇文章主要介绍了HTML5验证以及日期显示的实现详解，觉得挺不错的，现在分享给大家，也给大家做个参考。 1.Email输入框,自动验证Email有效性。 复制代码代码如下: <!DOCTYPE HTML>...
收集整理的这篇文章主要介绍了HTML5验证以及日期显示的实现详解，觉得挺不错的，现在分享给大家，也给大家做个参考。 1.Email输入框,自动验证Email有效性。 复制代码代码如下:
!DOCTYPE HTML>
html>
body>
form action="#" method="get">
E-mail: input type="email" name="user_email"/>
input type="submIT"/>
/form>
/body>
/html>
2.number数字输入，验证正确，可以设置开始结束位。
复制代码代码如下:
!DOCTYPE HTML>
html>
body>
form action="#" method="get">
input type="number" step="5" min="5"max="20" name="number" value="0"/>
input type="submit"/>
/form>
/body>
/html>
3.URL输入框，可以验证URL输入的有效性。
form action="#" method="get"> URL: input type="url" name="user_email"/> br /> input type="submit"/> /form>
4.Date pickers (date, month, week, time, datetime, datetime-local)选择框，可以选择日期，时间，月，周。
复制代码代码如下:
!DOCTYPE HTML>
html>
body>
form action="#" method="get">
Date: input type="date" name="user_email"/>
month : input type="month" name="user_email"/>
week: input type="week" name="user_email"/>
time: input type="time" name="user_email"/>
datetime: input type="datetime" name="user_email"/>
datetime-local : input type="datetime-local" name="user_email"/>
input type="submit"/>
/form>
/body>
/html>
5.datalist输入选择。
复制代码代码如下:
!DOCTYPE HTML> html>
body>
form action="#" method="get">
Webpage: input type="url" list="url_list"value="fDF" name="user_email"/>
datalist id="url_list">
option label="W3School"value="http://www.w3school.COM.cn"/>
option label="Microsoft" value="http://www.microsoft.com"/>
/datalist> input type="submit"/>
/form>
/body>
/html>
声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！
若转载请注明出处： HTML5验证以及日期显示的实现详解
本文地址： https://pptw.com/jishu/585208.html