HTML表单

1、表单标签：所有需要提交到服务器端的表单项必须使用

<form></form>

括起来。

form 标签属性：

action、整个表单提交的位置(可以是一个页面，也可以是一个后台 java 代码)；

method、表单提交的方式(get/post/delete……等 7 种)。

<form action="#" method="post">
</form>

1.1、文本输入项

用户名：<input type="text" name="username" size="40px" maxlength="5" readonly="readonly" placeholder="请输入用户名"/> <br />

1.2、密码输入项

密码：<input type="password" name="password" required="required"/> <br />
确认密码：<input type="password" name="repassword"/> <br />

required=”required”必填内容。

1.3、单选按钮

性别：<input type="radio" name="sex" value="男" checked="checked"/> 男
<input type="radio" name="sex" value="女"/> 女 <br />

value表示提交的名字，

checked=”checked”默认选中项。

1.4、多选按钮

爱好：<input type="checkbox" name="hobby" value="汽车"/> 汽车
<input type="checkbox" name="hobby" value="唱歌" checked="checked"/> 唱歌
<input type="checkbox" name="hobby" value="网购"/> 网购 <br />

value表示提交的名字

1.5、文件上传项

头像：<input type="file" name="file"/><br />

1.6、下拉列表

籍贯：<select name="province">
<option>请选择</option>
<option value="0">北京</option>
<option value="1" selected="selected">上海</option>
<option value="2">广州</option>
</select><br />

selected=”selected”，默认选中项。

1.7、文本输入域

自我介绍：<textarea name="zwjs">
</textarea><br />

1.8、提交按钮

提交按钮：<input  type="submit" value="注册"/><br />

1.9、普通按钮

普通按钮：<input  type="button" value="按钮"/><br />

1.10、重置按钮

重置按钮：<input  type="reset" value="重置"/><br />

1.11、隐藏项

<input type="hidden" name=""/>

用于用户比较敏感的一些信息。

demo代码：

<form action="#" method="get">
<table border="5px" width="800px" height="450px" bgcolor="white">
<tr>
<td colspan="2">会员注册 </td>
</tr>
<tr>
<td>用户名</td>
<td>
<input type="text" name="user"/>
</td>
</tr>

<tr>
<td>密码</td>
<td>
<input type="password" name="password" />
</td>
</tr>

<tr>
<td>确认密码</td>
<td>
<input type="password" name="repassword"/>
</td>
</tr>

<tr>
<td>Email</td>
<td>
<input type="text" name="email" />
</td>
</tr>

<tr>
<td>姓名</td>
<td>
<input type="text" name="username" />
</td>
</tr>

<tr>
<td>性别</td>
<td>
<input type="radio" name="sex" value="男" />男
<input type="radio" name="sex" value="女"/>女
</td>
</tr>

<tr>
<td>出生日期</td>
<td>
<input type="text" name="birthday" />
</td>
</tr>

<tr>
<td>验证码</td>
<td>
<input type="text" name="yzm" />
<img src="../img/yanzhengma.png" />
</td>
</tr>

<tr>
<td colspan="2">
<input type="submit" value="注册"/>
</td>
</tr>

</table>
</form>

注意：所有需要提交到服务器端的表单项必须使用

<form></form>

括起来。