星空网 > 软件开发 > 网页设计

HTML5 INPUT新增属性

HTML5的input标签新增了很多属性,也是让大家非常兴奋的一件事,用简单的一个属性搞定以前复杂的JS验证。input新增的这些属性,使得html和js的分工更明确了,使用起来十分舒畅。
我们先看下input新增了的属性:
新增属性一:autoconmplete
autoconmplete可以赋值为 on 或者 off。当为 on的时候,浏览器能自动存储用户输入的内容。当用户返回到曾经填写过值的页面的时候,浏览器能把用户写过的值自动填写在相应的input框里。
现在很多网站都实现了这个功能,不过基本都是用php来实现的。用了这个属性,无疑可以减少很多前端和后台的交流量和工作量。
新增属性二:autofocus
autofocus 可以赋值为 autofocus,也就是在页面加载完成的时候自动聚焦到这个input标签,自然 type="hidden"的时候是不能用的。 这个也是一个比较常见的效果,至今为止的实现方法是用js。在页面加载完时执行聚焦操作,现在也被一个属性搞定了。
可以想象,一个页面至多只有一个input标签会设置 autofocus,否则必然不会达到预期效果。因为不可能同事聚焦在两个input上。
新增属性三:required
input的有一个强力新增属性,免去验证的麻烦。可以赋值为 required。
比如用户注册页面的用户名和密码都是必填的,只要设置一个required就可以了。而在以前是需要js来验证或者后台验证的。
注意:这里required属性是需要用户来填写的,所以TYPE是button、submit、reset、image等等不需要用户填写选择的类型是不可以使用这个属性的。
新增属性四:placeholder
这个新增属性也是非常使用,用在type= text email等等类型的时候,提示用户输入信息的格式或者内容等等。这个效果在之前也是需要js来实现的。是一种比较常见的效果:

Name: 

 

Address: 


 HTML5 INPUT新增属性
新增属性五:新增list属性---联想框效果
这个属性显示类似于百度搜索框那种联想框效果,也是非常实用的一个属性。
注意从这个属性使用的特点:需要有对应的datalist标签;datalist子标签option支持 value和lable两个属性;list的属性值要和datalist的id一致。
使用示例 (opera支持)




原标题:HTML5 INPUT新增属性

关键词:HTML

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

回答:在阿联酋开站:注册是否需要申请vat:https://www.kjdsnews.com/a/1322081.html
荷兰vat站点: 全面了解荷兰增值税缴纳流程:https://www.kjdsnews.com/a/1322082.html
荷兰vat税率:6%及21%的最新情况:https://www.kjdsnews.com/a/1322083.html
关于vat和关税的不同之处:思考更深层次的差异:https://www.kjdsnews.com/a/1322084.html
菲律宾:如何应用vat以最佳利益达到财务目标:https://www.kjdsnews.com/a/1322085.html
法国服装vat:一份全面指南:https://www.kjdsnews.com/a/1322086.html
桂林酒店销售多少钱 桂林旅游宾馆价格:https://www.vstour.cn/a/410227.html
十里银滩旅游攻略玩什么住哪里怎么去?:https://www.vstour.cn/a/410228.html
相关文章
我的浏览记录
最新相关资讯
海外公司注册 | 跨境电商服务平台 | 深圳旅行社 | 东南亚物流