首页 > 其他 > 详细

表单元素的required,autocomplete,list用法

时间:2016-11-28 09:14:45      阅读:346      评论:0      收藏:0      [点我收藏+]

required:

当在一个表单元素如:input中加上required属性时,点击提交表单按钮,针对input会弹出一个默认的警告信息,如下图:

技术分享

代码如下:

<form id="myForm">
    Add your telephone:
    <input type="tel" name="phone" placeholder="input your telephone" required="required"/>
</form>
<input type="submit" form="myForm"/>

注意submit按钮并没有放在form里面,此处是用id链接submit与form关系的。这样让submit脱离了form,可以实现一些特殊的视觉效果。

autocomplete:

自动为我们提供所输入过的字符。可能的值为off、on,默认值为on。如下图:

技术分享

autocomplete的数据来自于浏览器(user agent)

list/datalist:

在HTML5中提供了一个list属性,可以用来提供autocomplete值,可以链接http://caniuse.com/#search=datalist查看支持情况。

技术分享

代码如下:

<form id="myForm">
    Add your telephone:
    <input type="tel" name="phone" list="myDataList" 
           placeholder="input your telephone" 
           required="required"/>
</form>
<input type="submit" form="myForm"/>
<datalist id="myDataList">
    <option value="dog">
    <option value="duck">
</datalist>

 

表单元素的required,autocomplete,list用法

原文:http://www.cnblogs.com/ywxgod/p/6108077.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!