HTML5表单.docxVIP

HTML5 表单HTML5 输入类型HTML5 新的 Input 类型HTML5 拥有多个新的表单输入类型。这些新特性提供了更好的输入控制和验证。本章全面介绍这些新的输入类型：emailurlnumberrangeDate pickers (date, month, week, time, datetime, datetime-local)searchcolor浏览器支持Input typeIEFirefoxOperaChromeSafariemailNo4910NourlNo4910NonumberNoNo97NorangeNoNo944Date pickersNoNo910NosearchNo41110NocolorNoNo11NoNo注释：Opera 对新的输入类型的支持最好。不过您已经可以在所有主流的浏览器中使用它们了。即使不被支持，仍然可以显示为常规的文本域。Input 类型 - emailemail 类型用于应该包含 e-mail 地址的输入域。在提交表单时，会自动验证 email 域的值。实例：!DOCTYPE HTMLhtmlbodyform action=/example/html5/demo_form.asp method=getE-mail: input type=email name=user_email /br /input type=submit //form/body/html提示：iPhone 中的 Safari 浏览器支持 email 输入类型，并通过改变触摸屏键盘来配合它（添加 @ 和 .com 选项）。Input 类型 - urlurl 类型用于应该包含 URL 地址的输入域。在提交表单时，会自动验证 url 域的值。实例:!DOCTYPE HTMLhtmlbodyform action=/example/html5/demo_form.asp method=getHomepage: input type=url name=user_url /br /input type=submit //form/body/html提示：iPhone 中的 Safari 浏览器支持 url 输入类型，并通过改变触摸屏键盘来配合它（添加 .com 选项）。Input 类型 - numbernumber 类型用于应该包含数值的输入域。您还能够设定对所接受的数字的限定：实例:!DOCTYPE HTMLhtmlbodyform action=/example/html5/demo_form.asp method=getPoints: input type=number name=points min=1 max=10 /input type=submit //form/body/html请使用下面的属性来规定对数字类型的限定：属性值描述maxnumber规定允许的最大值minnumber规定允许的最小值stepnumber规定合法的数字间隔（如果 step=3，则合法的数是 -3,0,3,6 等）valuenumber规定默认值提示：iPhone 中的 Safari 浏览器支持 number 输入类型，并通过改变触摸屏键盘来配合它（显示数字）。Input 类型 - rangerange 类型用于应该包含一定范围内数字值的输入域。range 类型显示为滑动条。您还能够设定对所接受的数字的限定：实例:!DOCTYPE HTMLhtmlbodyform action=/example/html5/demo_form.asp method=getPoints: input type=range name=points min=1 max=10 /input type=submit //form/body/html请使用下面的属性来规定对数字类型的限定：属性值描述maxnumber规定允许的最大值minnumber规定允许的最小值stepnumber规定合法的数字间隔（如果 step=3，则合法的数是 -3,0,3,6 等）valuenumber规定默认值Input 类型 - Date Pickers（日期选择器）HTML5 拥有多个可供选取日期和时间的新输入类型：date - 选取日、月、年month - 选取月、年week - 选取周和年time - 选取时间（小时和分钟）datetime - 选取时间、日、月、年（UTC 时间）datetime-local - 选取时间、日、月、年（本地时间）下面的例子允许您从日历中选取一个日期：!DOCTYPE HTMLhtmlbodyform action=/example/html5/demo_form.asp method=getDate: input type=date