JSP复习----html部分

JSP复习—-html部分

表单元素

常用的表单元素有form，input，select，textarea标签。今天主要回顾一下input标签的相关属性设置。

type属性	描述	相关属性设置
text	单行文本框	name,size,value,maxlength
radio	单选按钮	name,value,checked,id
reset	重置按钮	name,value
checkbox	复选框	name,checked,value,id
submit	提交按钮	name,value
button	普通按钮	name,value
password	密码框	name,value,size,maxlength
file	文件域	name,size,value,maxlength
hidden	隐藏域	name,value
image	图片域	name,src

下面为一个表单的例子：

<form action="index.html" method="post">
<table border="4"  cellspacing="0" align="center"  bordercolor="#9aca38">
<tbody>
<tr>
<td align="right" width="160" height="34" bgcolor="#999a00" >公司名称：</td>
<td width="275" height="34" bgcolor="#999a00"><input type="text" value="请输入关键字" onfocus="if(this.value=='请输入关键字')this.value=''" onblur="if(this.value=='')this.value='请输入关键字'" /></td>
</tr>
<tr bgcolor="#99cb36">
<td align="right" width="160" height="34">公司网站：</td>
<td width="275" height="34"><input type="text" value="http://"/></td>
</tr>
<tr bgcolor="#99cb36">
<td align="right" width="160" height="34">登陆密码：</td>
<td width="275" height="34"><input type="password" value="" size="22"/></td>
</tr>
<tr bgcolor="#99cb36">
<td align="right" width="160" height="34">
性   别：
</td>
<td width="275" height="34">
<input type="radio" name="sex" id="sex" value="男" checked/><label for="sex">男</label>      
<input type="radio" name="sex" id="sex2" value="女"/><label for="sex2">女</label>
</td>
</tr >
<tr bgcolor="#99cb36">
<td align="right" width="160" height="34">申请产品：</td>
<td>
<input type="checkbox" name="music" id="music"/><label for="music">实木</label>
<input type="checkbox" name="ps" id="ps" checked="checked"/><label for="ps">沙发</label>
<input type="checkbox" name="wzsj" id="wzsj"/><label for="wzsj">办公</label>
</td>
</tr>
<tr bgcolor="#99cb36">
<td align="right" width="160" height="34">联系人证件：</td>
<td><input type="file" /></td>
</tr>
<tr bgcolor="#99cb36">
<td align="right" width="160" height="34">密码查询问题：</td>
<td>
<select >
<option>请选择查询问题</option>
<option>爸爸的名字</option>
<option>爸爸的生日</option>
<option>妈妈的生日</option>
</select>
</td>
</tr>

<tr bgcolor="#99cb36">
<td align="right" background="images/aa_03.gif" width="161" height="98" >
备注：
</td>
<td>
<textarea rows="5" cols="31"></textarea>
</td>
</tr>
<tr bgcolor="#99cb36">
<td align="right"></td>
<td height="34"><input type="image" src="images/bb_03.gif"/> <input type="image" src="images/bb_05.gif" /></td>
</tr>
</tbody>
</table>
</form>

表单中的GET和POST区别

-GET：是url的一部分，因此会在地址栏中显示出来，安全性较低，其只能提交文本类型的数据，长度限制2048字节。

-POST：是HTTP消息的一部分，地址栏中不会显示，安全性较高，可提交数据类型不限，无长度限制。

—>响应成功后，服务器返回200和页面内容。