登录发现更多内容
首页
分类
目录
索引
标签
酷站
用户名
Email
自动登录
找回密码
密码
登录
成为会员
只需一步, 快速开始
登录
立即登录
立即注册
其他登录
QQ
微信
新首页
Portal
观海听潮
小百科
创业沙龙
关于我们
酷站
科技资讯
搜索
搜索
本版
帖子
用户
活动
好友
帖子
收藏
道具
勋章
任务
动态
记录
门户
导读
排行榜
设置
我的收藏
退出
首页
›
快活林
›
猿氏悟语
›
使用HTML5构建下一代的Web Form
0赞
赞赏
手机版
扫码打开手机版
把文字装进口袋
返回列表
使用HTML5构建下一代的Web Form
[ 复制链接 ]
马小云
2009-7-7 10:16:04
用户的需求,并且同时减少了开发人员的编程。在我看来,HTML5 主要在以下几个方面对目前的Web表单做了改进:
新的控件类型
还在为类型检查犯愁吗,还在为那一长串看不太明白的检验输入的正则表达式而苦恼吗,HTML5提供的一系列新的控件将天然的具备类型检查的功能。比如说URL输入框,Email输入框等。
<input type="url"></input>
<input type="email"></input>
当然还有非常重要的日期输入框,要知道使用JavaScript和CSS来“手工”制作一个日期输入框还是非常花功夫的,类似Dojo,YUI这样的类库也无不在这个widget上面大做文章。
<input type="date"></input>
作为我痛苦记忆的一部分,我经常记得我们开发人员要为一个select下拉别表动态的添加非常多的选项,这些选项大多数都是来自数据库,比如说国家、省市列表等等。这个事情非常繁琐。HTML5将支持data属性,为select控件外联数据源!
<select data="http://domain/getmyoptions"></select>改进的文件上传控件,你可以使用一个控件上传多个文件,自行规定上传文件的类型(accept),你甚至可以设定每个文件最大的大小(maxlength)。你看出它和一般操作系统提供的文件上传控件的区别了吗,反正我觉得基本一致了。
在HTML5应用中,文件上传控件将变得非常强大和易用。重复(repeat)的模型,HTML5提供一套重复机制来帮助我们构建一些重复输入列表,其中包括一些诸如add、remove、move-up,move-down的按钮类型,通过这一套重复的机制,开发人员可以非常方便的实现我们经常看到的编辑列表,这是一个很常见的模式,我们可以增加一个条目、删除某个条目、或者移动某个条目等等。
内建的表单校验系统,HTML5为不同类型的输入控件各自提供了新的属性,来控制这些控件的输入行为,比如我们常见的必填项required属性,以及为数字类型控件提供的max、min等。 而在你提交表单的时候,一旦校验错误,浏览器将不执行提交操作,而会显示相应的检验错误信息。 <input type="text" required></input>
<input type="number" min=10 max=100></input>
XML Submission,我们一般常见的是form的编码格式是application/x-www-form-urlencoded。开发人员都很清楚这种格式,数据送到服务器端,可以方便的存取。HTML5将提供一种新的数据格式:XML Submission,即application/x-www-form+xml。简单的举例说,服务器端将直接接收到XML形式的表单数据。
<submission>
<field name="name" index="0">Peter</field>
<field name="password" index="0">password</field>
</submission>
回复
使用道具
举报
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
显身卡
高级模式
B
Color
Image
Link
Quote
Code
Smilies
您需要登录后才可以回帖
立即登录
点评
本版积分规则
回帖后跳转到最后一页
综合
最新
热度
发表评论
4 回复
浏览过的版块
聚贤庄-IT人才招聘
IT业界
马小云
关注
主题数144
PPCN招聘网站设计/美工及网站编辑若干名
阅读 76184
Nginx 常见应用技术指南(Nginx Tips)
阅读 73553
苹果08年广告费近5亿美元 同比增长4%
阅读 73454
发布新话题
小帖士
如果你不是特别对他的每一句话感兴趣,不要随意用"关注"人的功能,因为关注以后,他的所有发帖回帖都会以通知的方式提醒你的!
统计信息
会员数: 4660 个
话题数: 8707 篇
巅峰数: 8 人
首页
分类
目录
索引
我的
返回顶部