Html代码：
<formid="from1">
<tablewidth="500"border="0"cellpadding="4"cellspacing="4">
<tr>
<tdcolspan="2"><divalign="center">本例包含 A-E 的内容</div></td>
</tr>
<tr>
<tdwidth="120">name</td>
<td><inputtype="text"name="name"placeholder="name"min="5"man="50"onFocus="$(this).select()"/></td>
</tr>
<tr>
<td>email</td>
<td><inputtype="email"required="required"name="email"/></td>
</tr>
<tr>
<td>website</td>
<td><inputtype="url"required="required"name="url"/></td>

</tr>
<tr>
<td>age</td>
<td><inputtype="number"name="age"pattern="[0-9]"data-message="请输入0-9的数字"/></td>

</tr> jQuery中html()使用事项<tr>
<td>time</td>
<td><inputtype="time"name="time"data-message="Please fill in the correct time"/></td>

</tr>
<tr>
<td>Password</td>
<td><inputtype="password"name="password"required="required"/></td>
</tr>
<tr>
<td>Password check</td>
<td><inputtype="password"name="check"data-equals="password"/></td>
</tr>
<tr>
<td>Hobby</td>
<td><inputname="Hobby"type="checkbox"class="checkbox"id="hoddy"value="01"group="mHobby">sleep</input><br/>
<inputname="Hobby"type="checkbox"class="checkbox"id="hoddy"value="02"group="mHobby">Swimming</input><br/>
<inputname="Hobby"type="checkbox"class="checkbox"id="hoddy"value="03"group="mHobby">Run</input>
</td>
</tr>
<tr>
<td>Sex</td>
<td><inputname="sex"type="radio"class="radio"value="0"checked>Man
<inputtype="radio"name="sex"value="1"class="radio">Woman</td>
</tr>
<tr>
<td>Other</td>
<td><textareacols="20"rows="5"required="required"data-message="Write something"></textarea></td>
</tr>
<tr>
<td>Country</td>
<td><selectname="select"required="required">
<optionselected value="0">请选择</option>
<optionvalue="111">中国</option>
<optionvalue="222">英国</option>
<optionvalue="333">美国</option>
</select></td>sweage和wastewater有什么区别
</tr>
<tr>
<td>Area</td>
<td><selectname="select2"size="5"multiple required="required">
<optionvalue="111">北京</option>
<optionvalue="222">上海</option>
<optionvalue="333">广州</option>
</select></td>
</tr>
<tr>
<td>I accept the terms</td>
<td><inputtype="checkbox"id="accept"required="required"class="checkbox"/></td>
</tr>
<tr>
<td></td>
<td><inputtype="Submit"class="btn"value="Submit"/></td>
</tr>
</table>
<br/>

</form>
A、常用html5增加的input类型包括：email、url、number、time.B、常用html5增加的input属性包括：required（必填）、pattern（验证正则表达式）、data-message（错误提示）、min（最小长度）、max（最大长度）、data-equals（判断两个输入框值是否一致，常用于密码框的2次输入）C、使用jquery验证：没有特殊样式需求，在表单后面调用下面的方法：$("#from1").validator();D、当input类型为time时，在支持html5的浏览器中，输入框自动识别输入格式，在不支持html5的浏览器中，使用以下代码：$.tools.validator.fn("[type=time]", "Please supply a valid time", function(input, value) {
   return /^\d\d:\d\d$/.test(value);
});$.tools.validator.fn()的三个参数分别是：input类型，错误提示，函数E、当data-equals属性出现时，在支持html5的浏览器中，自动验证两个输入框值是否相等，在不支持html5的浏览器中，使用以下代码：$.tools.validator.fn("[data-equals]", "Different value and $ 1", function(input) {
   var name = input.attr("data-equals"),
      field = this.getInputs().filter("[name=" + name + "]");
   return input.val() == field.val() ? true : [name];
});$.tools.validator.fn()的参数中‘$1’代表 data-equals 的值F、国家选项为菜单类型， 没有直接可以用的验证方法，使用以下代码：$.tools.validator.fn("[name=select]", "Please select a value", function(input, value) {
   if( value == "0"){
       return false;
   }else{
       return true;
   }
});再举个例子：验证id为name的文本框。$.tools.validator.fn("[id=name]", "该品牌已存在", function(input, value) { 
    if(isBrandExists()){
           return false;
     }else if(isBrandHasRel()){
           return false;
     }else{
          return true;
     }
});isBrandExists()和isBrandHasRel()方法是含有业务逻辑的验证。