Html5引入了一些新的input标签，它们包括number, range, email, url, color, date, datetime等。目前它们还不完全支持所有的浏览器。但做为一个Web Developer需要知道它们。Html5 提供了下面这些类型的<Input>标记:
Email (email)
URL (url)
Telephone No. (tel)
Number (number)
Range (range)
Color (color)
Date (date)
Month (month)
Week (week)
Time (time)
Date Time - UTC (datetime)
Date Time - Local (datetime-local)
Search (search)
下面我们来看一下在Asp.net MVC application中如何使用它们, 一开始是个静态的html代码：
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
</head>
<body>
<form id="form1">
<p>Email :</p>
<input type="email" name="email" />
<p>URL :</p>
<input type="url" name="url" />
<p>Telephone No. :</p>
<input type="tel" name="tel" />
<p>Number :</p>
<input type="number" name="number" min="1" max="10" step="2"/>
<p>Range :</p>
<input type="range" name="range" min="1" max="10" step="2" />
<p>Date :</p>
<input type="date" name="date" />
<p>Month :</p>
<input type="month" name="month" />
<p>Week :</p>
<input type="month" name="week" />
<p>UTC Date Time :</p>
<input type="datetime" name="utcdatetime" />
<p>Local Date Time :</p>
<input type="datetime-local" name="localdatetime" />
<p>Time :</p>
<input type="time" name="time" />
<input type="Submit" value="Submit" />
</form>
</body>
</html>
在Opera 12.02 打开后，你可以看到这个效果：
你也可以使用 Chrome，IE 9，FF 13.01并不支持。我们看到上面呈现出原生的UI，这是我们想要的。在Asp.net MVC application中，可以这样来实现它们：
<%= Html.TextBox("range","2",new {type="range",min="1",max="10"}) %>
上面的代码等同于下面的html:
<input id="range" max="10" min="1" name="range" type="range" value="2">
如果你使用StrongType,那可以这样实现:
<%= Html.TextBoxFor(m => m.MyRange, new {type="range",min="1",max="10"}) %>
其它一些您可以自行探索，HTML5 推出了一些新的输入元素的输入类型，例如数字、范围、email、url、颜色、日期、日期时间等更多。 这些新的Input类型非常棒，因为它们允许您验证用户输入，而无需使用任何客户端脚本。 目前并非所有浏览器都支持这些输入型的，但下一个版本的所有主要浏览器将支持他们。 你可以开始在ASP.net 应用程序中使用它们，并且很少或没有额外的工作。
希望对您Web开发有帮助。更多参考：
- W3C input overview by Michael Smith
- Sandbox of all input types by Estelle Weyl
- Examples of the input types by Estelle Weyl
- JavaScript checking by type by Mike Taylor
作者：Petter Liu
出处：http://www.cnblogs.com/wintersun/
本文版权归作者和博客园共有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接，否则保留追究法律责任的权利。
该文章也同时发布在我的独立博客中-Petter Liu Blog。
