注册表单的css设计及验证功能的实现
需求图:
要求完成验证功能:
- 用户名必须填写
- 密码长度8-16之间
- 邮箱地址,手机号必须符合正确格式
- 必须同意(勾选复选框)才能提交
- 要求所有错误提示同时显示
html:
<div>
<h1>create new account</h1>
<form action="result.html">
<table>
<tr>
<td>Username:</td>
<td><input type="text" name="username" placeholder="用户名" ></td>
<td><span id="vname"></span></td>
</tr>
<tr>
<td>Password:</td>
<td><input type="password" name="password" placeholder="8-16位密码"></td>
<td><span id="vpwd"></span></td>
</tr>
<tr>
<td>Email:</td>
<td><input type="text" name="email" placeholder="邮箱"></td>
<td>