如果我们给表单输入框应用名为”email”的type属性，我们可以命令浏览器只允许符合有效的电子邮件地址结构的字符串。没错，内置表单验证即将到来，由于一些显而易见的原因，我们还不能100%依赖内置验证，较旧的浏览器不认识这个”email”型，它们会简单地退回到普通文本框。

<form action="" method="get">    <label for="email">邮箱:</label><input id="email" name="email" type="email" />    <button type="submit">确定</button></form> 

　　经我小测了下，貌似仅在Chrome浏览器下有效果(xp系统)，当输入内容不是合法邮箱格式，点击“确定”按钮是没有反应的;当输入为合法邮箱，点击“确定”按钮才会提交刷新页面。

　　还应当指出，当谈到哪些元素和属性支持和不支持时，当前所有的浏览器都有点靠不住的。例如，Opera似乎支持电子邮件验证，但仅在name属性被指定的时候。而且，它不支持占位符属性，这个我们将会在后面学到。底线是不依赖于这种形式的验证…但你仍然可以使用它!

　　八、占位符(Placeholders)

　　//zxx:此处内容非直译，有删改

　　Placeholders什么意思呢，就是文本框/文本域空间默认会有个文字提示，获得焦点时，此提示文字消失;失去焦点时如果内容为空，提示文字又出现。如下图所示：

　　这些表单控件里面显示的些提示性的文字就是占位符。按照以往的做法，我们需要使用一点JavaScript代码实现占位符效果，例如我之前的“文本框/域文字提示自动显示隐藏jQuery小插件”一文所展示的。当然，你需要设定一个初始的默认的value值，然后根据输入内容进行判断，从而决定文本框值的改变与否。如果您使用占位符(placeholders)属性，一切就轻松了。

<label for="email">邮箱:</label><input id="email" type="email" placeholder="zhangxinxu@zhangxinxu.com" size="26" /> 

　　根据我的测试，目前仅webkit核心的浏览器支持placeholders属性，像是Chrome5，Safari4，结果如下所示：

　　您可以狠狠地点击这里：HTML5占位符Demo