Java EE WEB工程师培训-JDBC+Servlet+JSP整合开发之33.HTML表单

• 本季内容提要
–HTML 表单（Form）简介
• 表单简介
–Input
• Text
• Password
• hidden
• Checkbox
• Radio
• File
• Button
• Reset
• submit
–Select
• Option
–Textarea

###############Michael分割线#####################

• HTML 表单（Form）简介
–表单简介
• 表单的作用
–表单用来收集用户信息，到服务器处理或保存，是用户交互的主要工具。例如：用户登录需要输入用户名称和密码、注册会员需要输入会员信息等。
• 表单的格式

• Input
– Text
• Text 元素为用户提供了输入文本的能力，例如： 

<input type=“TEXT” name="NAME" value="VALUE" size=15>

 
– Password
• Password 元素为用户提供输入密码的能力，输入的数据被显示为“*”,例如：

password: <input name="pw" value=“amaker" type="password">

– Hidden
• Hidden 元素提供一个隐藏数据，也成为“隐藏域”，该值不显示在页面中，供程
序内部使用，例如：

<input name=“id" value=“1" type="hidden">

– Checkbox
• Checkbox 元素提供用户一种多项选择的功能，例如，要收集用户的爱好信息

<ul>    
<li> box a <input name="checkb" value="a" type="checkbox"></li>    
<li> box b <input name="checkb" value="b" type="checkbox"></li>    
</ul>

– Radio
• Radio元素提供了一种单项选择的能力，例如选择用户的性别

<ul>    
<li> radio a <input name=“gender" value="1" type="radio"></li>    
<li> radio b <input name=“gender" value=“2" type="radio"></li>    
</ul>

– File
• File元素提供了文件浏览选择的能力，例如要选择、上传文件等

<input type=“file” name=“f” >

– Button
• Button 元素提供一个普通按钮，不产生任何动作，例如

<input type=“button” name=“b1” value=“Click me!”>

– Reset
• Reset提供了清空表单数据的功能，例如要重新添加数据

<input type=“reset” name=“r1” value=“重填”>

– Submit
• Submit提供了提交表单的能力，当点击submit按钮时，表单的action属性会被调用

<input type=“submit” name=“s1” value=“保存”>

• Select
–Option
• Select 提供了多项选择的功能，option是用来构造选择项，例如：

<select name=NAME size=SIZE multiple>    
<option value=V1> A1</option>    
<option value=V2> A2</option>    
...    
<option value=Vn> An</option>    
</select>

–Textarea
• Textarea 提供了输入大文本的能力，例如：要输入用户的简历，内容很多就可以使用之

<textarea name="comments" rows="15" cols="80" style="background:rgb(200,200,255)">    
Enter Comments here:    
</textarea>

 

###############Michael分割线#####################