1.html表单的提交:
<form action="" method= ""> </form>
action属性设置提交的服务器地址
method属性设置提交方式GET(默认)或POST
2.表单提交数据没有发送给服务器的三种情况:
1.表单项没有name属性
2.单选,复选都需要添加value属性,以便发送给服务器
3.表单项不在提交的form标签中
3.GET请求的特点:
1.浏览器地址栏中的地址是:action属性[+?+请求参数]
2. 请求参数的格式:name=value&name=value
3.不安全
4.若表单值包含ASCII或超过100个字符,必须使用 method=“post”
4.POST请求的特点:
1…浏览器地址栏中只有action属性,即服务器地址
2.相对于GET请求更安全(因为地址栏没有请求参数)
3.理论上没有数据长度的限制
一个简单的html表单页面
首先完成html表单雏形:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>标题</title>
</head>
<body>
<!--表单是html界面收集用户信息,并最后发送给服务器-->
<!--创建一个收集个人信息注册的表单页面,包含用户名,密码,确认密码-->
<form><!--form标签就是表单-->
用户名称: <input type="test" value="默认值"><br/> <!--test是文本输入框-->
用户密码: <input type="password"> <br/> <!--password是密码输入框,自动掩盖-->
确认密码: <input type="password"> <br/>
性别:<input type="radio" name="sex"> 男 <input type="radio" name="sex"> 女 <br/> <!--radio是单选框,通过同name分组实现单选-->
语言偏好:<input type="checkbox" > java <input type="checkbox" > python <input type="checkbox" > c++ <br/><!--checkbox代表多选框-->
国籍 <select>
<option selected="selected">中国</option> <option>美国</option> <option>瑞士</option> <!--select是下拉列表框,option是选项,默认selected-->
</select> <br/>
自我评价:<textarea rows="10" cols="20">请输入自我评价</textarea> <br/> <!--textarea多行文本输入框,开始结束标签中是默认值-->
<input type="reset"> <!--重置窗口--> <input type="submit" > <!--提交按钮--> <input type="button" value="普通按钮"> <!--普通按钮-->
<input type="file" value="选择文件"> <!--选择文件按钮--> <input type="hidden"> <!--隐藏域,需要发送给服务器且屏蔽用户-->
</form>
</body>
</html>
可以进一步优化是的表单格式化(方法是把表单form放在表格table中):
在form标签内加上action属性,指定表单提交地址
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>标题</title>
</head>
<body>
<!--表单是html界面收集用户信息,并最后发送给服务器-->
<!--创建一个收集个人信息注册的表单页面,包含用户名,密码,确认密码-->
<form action="http://localhost:8888" method="get"><!--form标签就是表单-->
<h2 align="center">用户注册</h2> <!--表单标题-->
<table align="center"><!--将表单放在表格里美化格式-->
<tr>
<td>用户名称:</td>
<td> <input type="test" name="username" value="默认值"> </td>
</tr>
<tr>
<td>用户密码:</td>
<td> <input type="password" name="password"> </td>
</tr>
<tr>
<td>确认密码:</td>
<td> <input type="password"> </td>
</tr>
<tr>
<td>性别:</td>
<td> <input type="radio" name="sex" value="man"> 男 <input type="radio" name="sex" value="girl"> 女 </td>
</tr>
<tr>
<td>语言偏好:</td>
<td> <input type="checkbox" > java <input type="checkbox" > python <input type="checkbox" > c++ </td>
</tr>
<tr>
<td> 国籍</td>
<td> <select>
<option selected="selected">中国</option> <option>美国</option> <option>瑞士</option> <!--select是下拉列表框,option是选项,默认selected-->
</select> </td>
</tr>
<tr>
<td> 自我评价:</td>
<td> <textarea rows="10" cols="20">请输入自我评价</textarea> </td>
</tr>
<tr>
<td> <input type="reset"> <!--重置窗口--> </td>
<td> <input type="submit"> <!--提交按钮--> </td>
<td> <input type="file" value="选择文件"> <!--选择文件按钮--> </td>
</tr>
</table>
</form>
</body>
</html>