表单的输入控件主要是input和select。其中input可以是多种类型,通过type属性来进行定义,type可以取值是text,radio,checkbox,password,submit,reset.
select是和option组合使用的。后台要想获得表单的值,是通过name属性的值来获得用户的输入。
后台获取的值:
input-text-name
input-redio-name-value
input-checkbox-name-value
input-password-name
input-textarea-name
select-option-name-value
下面是综合应用这些组成一个注册表单。
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title></title> </head>
<body>
<center>
<h1 style="color:blue;">注册表单</h1>
<hr/>
<form name="reg" action="regsuccess.html" method="post"> <table cellspacing="" cellpadding="" border="">
<tr>
<td>用户名:</td>
<td><input type="text" name="username"/></td>
</tr>
<tr>
<td>密码:</td>
<td><input type="password" name="pwd"/></td>
</tr>
<tr>
<td>确认密码:</td>
<td><input type="password" name="confirmpwd"/></td>
</tr>
<tr>
<td>电子邮箱:</td>
<td><input type="text" name="email"/></td>
</tr>
<tr>
<td>性别:</td>
<td><input type="radio" name="gender" value='' checked/>男<input type="radio" name="gender" value=''/>女</td>
</tr>
<tr>
<td>学历:</td>
<td>
<select name="edulevel"/>
<option value="-1">--请选择学历--</option>
<option value="">小学</option>
<option value="">初中</option>
<option value="">高中</option>
<option value="">学士</option>
<option value="">硕士</option>
<option value="">博士</option>
<option value="">博士后</option>
</td>
</tr>
<tr>
<td>爱好:</td>
<td>
<input type="checkbox" name="hoby" value="reading"/>读书
<input type="checkbox" name="hoby" value="movie"/>电影
<input type="checkbox" name="hoby" value="shopping"/>购物
<input type="checkbox" name="hoby" value="internet"/>上网
<input type="checkbox" name="hoby" value="other"/>其他
</td>
</tr>
<tr>
<td>上传头像:</td>
<td><input type="file"/></td>
</tr>
<tr>
<td>服务协议:</td>
<td><textarea rows="" cols="">rule </textarea></td>
</tr>
<tr>
<td>是否接受协议:</td>
<td><input type="checkbox"name='rule'value='accept'/>接受</td>
</tr>
<tr>
<td colspan="" align="center"><input type="submit" value="注册">
<input type="reset" value="重置"/></td>
</tr> </table> </form>
</center>
</body>
</html>
显示效果如下: