html表单基础

表单：用户搜集用户的信息，比如登录表单的用户名、密码等。

这些信息会提交给服务器来验证。

input标记：

<!--下面这一句中不添加name的话，系统不会提交这个内容-->

<input type="text" name="username" size="20" disabled="true" value="tom"/>

type="text"：文本输入框；

type="submit"：提交按钮

type="button"：普通按钮

type="reset"：重置按钮

type="password"：密码输入框

type="radio"：单选（checked="checked"默认选则）

type="checkbox"：多选（checked="checked"默认选则）

type="file"：上传文件（必须给form添加enctype="multipart/form-data"）

type="hidden"：隐藏域（默认提交一些内容）

size="20"：最多显示20个字符

name="username"：相当于变量名

disabled="true"：不可编辑

value="tom"：默认值是tom。

非input标记：

<textarea>：多行文本框

<select>:下拉框

form的method方式：

get:默认模式，提交的信息可以在URL中看到。

例如：file:///G:/Java/java_ee/first.html?username=123456&passwd=111111中

有两个变量名，username和passwd是代码中设置name属性的内容。

?username=后面的123456就是提交的用户名。

&passwd=后面的111111就是提交的密码。

post:这种模式提交的信息在URL中看不到。

代码：

<html>
	<head>
		<title>HTML表单基础</title>	
		<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
	</head>
	<body>
		<form method="get">
			<table border="1">
				<tr>
					<td align="right">用户名:</td>
					<td>	
						<!--下面这一句中不添加name的话，系统不会提交这个内容-->
						<input type="text" name="username" size="20" disabled="true" value="tom"/>
					</td>
				</tr>   
				<tr>
					<td align="right">密码:</td>
					<td>	
						<!--下面这一句中不添加name的话，系统不会提交这个内容-->
						<input type="password" name="passwd" size="20"/>
					</td>
				</tr>
				
				<tr>
					<td align="right">性别:</td>
					<td>
						<!--单选框radio-->
						男<input type="radio" name="sex" value="m" checked="checked"/>
						女<input type="radio" name="sex" value="f" />
					</td>
				</tr>
				<tr>
					<td align="right">爱好:</td>
					<td>
						<!--复选框checkbox-->
						足球<input type="checkbox" name="interest" value="footing" />
						做饭<input type="checkbox" name="interest" value="cooking" checked="checked"/>
						钓鱼<input type="checkbox" name="interest" value="fishing" />
					</td>
				</tr>
				<tr>
					<td align="right">照片:</td>
					<td>
						<input type="file" name="imgfile" />
					</td>
				</tr>
				<tr>
					<td>自我描述:</td>
					<td>
						<!--多行文本编辑框-->
						<textarea name="desc" rows=3" cols="20">
						</textarea>
					</td>
				</tr>
				<tr>
					<td>城市:</td>
					<td>
						<!--下拉框select
							multiple="multiple"可按住Ctrl多选
							selected="true"设置默认选项
						-->
						<select name="city" multiple="multiple">
							<option value="BJ">北京</option>
							<option value="SH">上海</option>
							<option value="XA" selected="true">西安</option>
						</select>
					</td>
				</tr>
				<!--隐藏域-->
				<input type="hidden" name="key" value="somedata" />
				<tr>
					<td colspan="2" align="center">
							<!--提交按钮-->
							<input type="submit" value="注册"/>
							<!--重置按钮-->
							<input type="reset" value="重置"/>	
							<!--普通按钮-->
							<input type="button" value="点我没用"/>	
					</td>
				</tr>
				
			</table>
		</form>
	</body>
</html>

界面如下：