创建表单
表单是实现动态网页的一种主要的外在形式,使用表单可以收集客户端提交的信息。
表单是网站互动功能的重要组成部分
使用<from>标记,并在其中插入相关的表单元素,即可创建表单。
<from>标记的属性 | |
属性 | 说明 |
name | 表单名称 |
method | 表单的提交方式,一般为GET或者POST方法 |
action | 指向处理该表单页面的URL(相对位置或者绝对位置) |
注意事项:URL统一资源定位系统
<form name="index" method="post" action="index.php">
<table width="300" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="30"> 订单号:
<input type="text" name="user" size="20" >
<input type="submit" name="submit" value="提交">
</td>
</tr>
</table>
</form>
![](https://i-blog.csdnimg.cn/blog_migrate/7dcb02b2c1c5d6ade4d95a1854a0acb6.png)
知识点:  空格符号(半角的不断行的空白格)
了解表单元素
表单由表单元素组成,常用的表单元素标记包括输入域标记<input>、选择域标记<select>和<option>、文字域标记<textarea>等
输入域标记<input>
输入域的类型
text文本框、password密码域、file文件域、image图像域、radio单选按钮、checkbox复选框、submit提交按钮、reset重置按钮、button普通按钮、hidden隐藏域
<from>
<input name = "表示输入域的名称" type = "表示输入域的类型"
value = "表示文本框的默认值" size = "文本框的宽度(以字符为单位)"
maxlength = "文本框的最大输入字符数">
<from>
示例:
text文本框
<from>
<input name = "user" type = "text" size="20" maxlength="100">
<from>
password密码域
<from>
<input name = "pwd" type = "password" size="20" maxlength="100">
<from>
file文件域
<from>
<input name = "file" type = "file"
enctype = "multipart/form-data" //上传文件时需要指明表单属性才可以实现上传功能
size = "20" maxlength = "100">
<from>
image图像域
<from>
<input name = "image" type = "image"
src = "D:\专业学习包\网站建设\图片\用户登入界面.png"
width = "500" height = "240" border = "0">
<from>
checkbox复选框
<from>
<input name="checkbox" type="checkbox" value="学习" checked>学习
<input name="checkbox" type="checkbox" value="生活">生活
<input name="checkbox" type="checkbox" value="爱情">爱情
<from>
submit提交按钮
<from>
<input type="submit" name="submit" value="登录">
<from>
reset重置按钮
<from>
<input type="reset" name="submit2" value="重置">
<from>
选择域标记<select>和<option>
name表示选择域的名称;size表示列表的行数;value表示菜单的选项值;multipe表示以菜单方式显示数据,省略则以列表方式显示数据。
<select name="select" multiple> //此处可添加
<option value="我喜欢你">我喜欢你</option>
<option value="I love you" selected>I love you</option> //表示默认选中
<option value="Je t`aime,Je t`adore">Je t`aime,Je t`adore</option>
<option value="Ich liebe Dich">Ich liebe Dich</option>
</select>
不添加multiple(列表框)
![](https://i-blog.csdnimg.cn/blog_migrate/1c3521432f1b456df2065a4b7471cfa5.png)
添加multiple(菜单框)
![](https://i-blog.csdnimg.cn/blog_migrate/60a070215809b91cbeb27e29ea4dab26.png)
文字域标记<textarea>
name表示文字域的名称;rows表示文字域的行数;cols表示文字域的列数(这里的rows和cols以字符为单位);value表示文字域的默认值;warp用于设定显示和送出时的换行方式(值为off表示不自动换行;值为hard表示自动硬回车换行,值为soft表示自动软回车换行)。
<form name="form1" method="get" action="index.php">
<textarea name="remark" cols="18" rows="5" wrap="soft">I LOVE YOU</textarea>
<br><br>
<input type="submit" name="Submit" value="提交">
</form>
![](https://i-blog.csdnimg.cn/blog_migrate/2f674fd6eb8dc9b722a9ad063d46e1dc.png)
提交表单数据
使用POST方法提交表单
POST方法不依赖于URL,不会显示地址栏。POST方法可以没有限制地传递数据到服务器,所有提交的信息在后台传输,用户在浏览器端是看不到这一过程的,安全性高。
使用GET方法提交表单
GET方法提交的表单数据被附加到URL(统一资源定位系统)后,作为URL的一部分发送到服务器端。由于GET方法提交的数据是附加到URL上发送的,因此在URL的地址栏中会显示“URL+用户传递的参数”且URL的长度要限制在1MB字符以内。
GET方法的参数格式如下:
http://url?name1=value1&name2=value2...
url为表单响应地址(如:127.0.0.1/index.php) ,name1为表单元素的名称,value1为表单元素的值。url和表单元素之间用“?”隔开,而多个表单元素之间用“&”隔开,每个表单元素的格式都是name=value,固定不变。
获取表单数据
传递参数的常用办法
PHP参数传递的常用三种方法:$_POST[ ]、$_GET[ ]、$_SESSION[ ],分别用于获取表单、URL与Session变量的值。
在Web页面嵌入PHP脚本
直接在HTML标记中添加PHP标记符<?php和?>,写入PHP脚本
<?php
include("top.php"); //引用外部文件
?>
获取表单数据
通过POST方法将各个组件的值提交到本页,在通过$_POST来获取提交的值。
设计表单(表单的设计步骤可参照上文)
对表单提交的数据进行处理,输出各组件提交的数据,代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<form action="index.php" method="post" name="form1" enctype="multipart/form-data">
<table width="405" height="24" border="1" cellpadding="1" cellspacing="1" bordercolor="#FFFFFF" bgcolor="#999999">
<tr bgcolor="#9393FF">
<td width="103" height="25" align="right">姓名:</td>
<td height="25" align="left"><input name="user" type="text" size="20" maxlength="100"></td>
</tr>
<tr bgcolor="#9393FF">
<td width="103" height="25" align="right">密码:</td>
<td width="289" height="25" align="left"><input name="pwd" type="password" size="20" maxlength="100"></td>
</tr>
<tr bgcolor="#9393FF">
<td height="25" align="right">爱好:</td>
<td height="25" align="left"><select name="select" multiple>
<option value="我喜欢你">我喜欢你</option>
<option value="I love you" selected>I love you</option> //表示默认选中
</select></td>
</tr>
<tr bgcolor="#9393FF">
<td height="25" align="right">百态:</td>
<td height="25" align="left">
<input name="checkbox" type="checkbox[]" value="学习" checked>学习
<input name="checkbox" type="checkbox[]" value="生活">生活
<input name="checkbox" type="checkbox[]" value="爱情">爱情
</td>
</tr>
<tr bgcolor="#9393FF">
<td height="25" align="right">文件: </td>
<td height="25" align="left">
<input name = "file" type = "file" enctype = "multipart/form-data" size = "20" maxlength = "100">
</td>
</tr>
<tr bgcolor="#9393FF">
<td height="25" align="right">个人信息: </td>
<td height="25" align="left"><textarea name="remark" cols="18" rows="5" wrap="soft">I LOVE YOU</textarea></td>
</tr>
<tr align="center" bgcolor="#9393FF">
<td height="25" colspan="2"><input type="submit" name="submit" value="登录">
<input type="reset" name="submit2" value="重置"></td>
</tr>
</table>
</form>
<?php
if(isset($_POST['submit']) && $_POST['submit'] =="登录"){
echo "您的个人信息是:";
echo " 姓名:".$_POST['user'];
echo " 密码:".$_POST['pwd'];
echo " 爱好:".$_POST['select'];
echo " 百态:";
if($_POST['checkbox']){
for($i=0;$i<count($_POST['checkbox']);$i++)
echo $_POST['checkbox'][$i]." ";
}
$path = './upfiles/'. $_FILES['file']['name'];
move_uploaded_file($_FILES['file']['tmp_name'],$path);
echo " 文件:".$path;
echo " 个人信息:".$_POST['remark'];
}
?>
</body>
</html>
![](https://i-blog.csdnimg.cn/blog_migrate/d64024ddf08c699035a616a3b846b1c1.png)