表单处理

  表单的概念在生活中很常见,就像是问卷调查表一样,别人先把问卷发给你,你照着问卷的要求填写,完事过后再将填完的问卷发给别人,从而达到一个将别人需要的信息传递给别人的一种方式。
  传统的网页大多数的作用都是展示数据,就是将信息传递给用户。而在现代化的 Web 开发中,非常注重信息交互,所以表单也随处可见,只是形式上变成网页,性质上还是一模一样的。主要的作用任然是 收集指定的用户信息。

1.表单的基本使用

HTML 中有一个专门用于提交数据的标签: <form> ,通过这个标签可以很容易的收集用户输入.

form 标签有两个必要属性:
  action:表单提交地址(填完了,交给谁)
  method:表单以什么方式提交

例如,我们需要在登录界面上收集用户输入的用户名和密码:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF‐8">
  <title>登录</title>
</head>
<body>
  <form action="login.php" method="post">
    <div>
      <label for="username">用户名</label>
      <input type="text" id="username" name="username">
    </div>
    <div>
      <label for="password">密码</label>
      <input type="password" id="password" name="password">
    </div>
    <button type="submit">登录</button>
  </form>
</body>
</html>

按照目前的情况,用户第一次请求得到这个表单页面,填写完表单内容,点击登录,表单会自动发送到login.php ,剩下的问题就是要考虑如何在 login.php 中获取到用户提交过来的内容.

PHP 中有三个超全局变量专门用来获取表单提交内容:
$_GET :用于获取以 GET 方式提交的内容
$_POST :用于获取以 POST 方式提交的内容
$_REQUEST :用于获取 GET 或 POST 方式提交的内容

借助  $_POST 或者  $_REQUEST 就可以获取到表单提交的内容:

<?php
// 获取表单提交的用户名和密码
echo '用户名:' . $_REQUEST['username'];
echo '密码:' . $_REQUEST['password'];

1.1.  提交地址

  action 提交地址指的是这个表单填写完成过后点击提交,发送请求的请求地址是什么。
  从便于维护的角度考虑,一般我们最常见的都是提交给当前文件,然后在当前文件中判断是否是表单提交请求:

<?php
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
  // 表单提交请求
}

另外,建议使用 $_SERVER['PHP_SELF'] 动态获取当前页面访问路径,这样就不用因为文件重命名或者网站目录结构调整而修改代码了:

<!‐‐ 这样写死 action 地址,当文件重命名就需要修改代码 ‐‐>
<form action="/foo/login.php">
  <!‐‐ ... ‐‐>
</form>
<!‐‐ 通过 `$_SERVER['PHP_SELF']` 获取路径,可以轻松避免这个问题 ‐‐>
<form action="<?php echo $_SERVER['PHP_SELF']; ?>">
  <!‐‐ ... ‐‐>
</form>

1.2.  提交方式

method 可以用于设置表单提交的方式,目前我们所认识的就是最常见两种表单提交方式: GET 和 POST 。
  从效果上来看,两者都可以将数据提交到服务端,但是从实现提交的原理上两者有很大的不同:
GET
  表单数据是通过 URL 中的 ? 参数传递到服务端的
  可以在地址栏中看到提交的内容
  数据长度有限制,因为 URL 地址长度有限(2000个字符)
POST
  表单数据是通过请求体传递到服务端的,我们在界面上看不到
  可以提交任何类型的数据,包括文件
  由于界面上看不见,浏览器也不储存,所以更安全
  至于什么情况下应该选用哪种方式,这个需要结合业务场景和这两种方式各自的特点来决定,没有绝对的答案,只能给出一些原则:
  绝不能使用 GET 来发送密码或其他敏感信息!!!
  应该想清楚这次请求到底主要是去拿东西,还是去送东西

2.  常见表单元素处理

至于表单元素中的文本框文本域一类的元素,都是直接将元素的 name 属性值作为键,用户填写的信息作为值,发送到服务端。但是表单元素中还有一些比较特殊的表单元素需要单独考虑:

2.1.  单选按钮

<!‐‐ 最终只会提交选中的那一项的 value ‐‐>
<input type="radio" name="gender" value="male">
<input type="radio" name="gender" value="female">

2.2.  复选按钮

<!‐‐ 没有设置 value 的 checkbox 选中提交的 value 是 on ‐‐>
<input type="checkbox" name="agree">
<!‐‐ 设置了 value 的 checkbox 选中提交的是 value 值 ‐‐>
<input type="checkbox" name="agree" value="true">

如果需要同时提交多个选中项,可以在  name 属性后面 跟上  [] :

https://php.net/manual/zh/faq.html.php#faq.html.arrays

<input type="checkbox" name="funs[]" id="" value="football">
<input type="checkbox" name="funs[]" id="" value="basketball">
<input type="checkbox" name="funs[]" id="" value="world peace">

最终提交到服务端,通过  $_POST 接收到的是一个索引数组.

2.3.  选择框

<select name="subject">
  <!‐‐ 设置 value 提交 value ‐‐>
  <option value="1">语文</option>
  <!‐‐ 没有设置 value 提交 innerText ‐‐>
  <option>数学</option>
</select>

2.3.  文件上传

type 属性为 file 的 input 元素可以通过表单提交文件(上传文件),服务端 PHP 可以通过 $_FILES 获取上传的文件信息。

<?php
// 如果选择了文件 $_FILES['file']['error'] => 0
// 详细的错误码说明:http://php.net/manual/zh/features.file‐upload.errors.php
if ($_FILES['file']['error'] === 0) {
  // PHP 在会自动接收客户端上传的文件到一个临时的目录
  $temp_file = $_FILES['file']['tmp_name'];
  // 我们只需要把文件保存到我们指定上传目录
  $target_file = '../static/uploads/' . $_FILES['file']['name'];
  if (move_uploaded_file($temp_file, $target_file)) {
    $image_file = '/static/uploads/' . $_FILES['file']['name'];
  }
}

$_FILES 同样也是一个关联数组,键为表单的  name ,内容如下:

array(1) {
  ["avatar"]=>
  array(5) {
    ["name"]=>
    string(17) "demo.jpg"
    ["type"]=>
    string(10) "image/jpeg"
    ["tmp_name"]=>
    string(27) "C:\Windows\Temp\php786C.tmp"
    ["error"]=>
    int(0)
    ["size"]=>
    int(29501)
  }
}

php中的form表单的更多相关文章

  1. Javascript中的Form表单知识点总结

    Javascript中的Form表单知识点总结 在HTML中,表单是由form元素来表示的,但是在javascript中,表单则由HTMLFormElement类型,此元素继承了HTMLElement ...

  2. Django中的Form表单

    Django中已经定义好了form类,可以很容易的使用Django生成一个表单. 一.利用Django生成一个表单: 1.在应用下创建一个forms文件,用于存放form表单.然后在forms中实例华 ...

  3. 小程序 <web-view></web-view> 中使用 form 表单提交

    在最近的小程序项目中,使用到了 <web-view></web-view> 内嵌 H5 页面,在 H5 中需要使用 form 表单提交数据. H5 使用的技术框架是 vue+v ...

  4. Django中的Form表单验证

    回忆一下Form表单验证的逻辑: 前端有若干个input输入框,将用户输入内容,以字典传递给后端. 后端预先存在一个Form表单验证的基类,封装了一个检测用户输入是否全部通过的方法.该方法会先定义好错 ...

  5. Django 中的Form表单认证

    一.Form表单   1.1 Form的几个功能 验证用户数据(显示错误信息) 初始化页面显示内容 HTML Form提交保留上次提交数据 生成HTML标签   1.2 创建表单类Form 1. 创建 ...

  6. django中的 form 表单操作

     form组件  1. 能做什么事?   1. 能生成HTML代码  input框   2. 可以校验数据   3. 保留输入的数据   4. 有错误的提示   1. 定义   from django ...

  7. 第83天:jQuery中操作form表单

    操作form表单 1. 属性操作 设置属性: // 第一个参数表示:要设置的属性名称 // 第二个参数表示:该属性名称对应的值 $(selector).attr(“title”, “传智播客”); 获 ...

  8. javaWeb 中前端Form表单数据处理(手动拼json)

    在前端我们会用到最多的就是form表单提交数据,在form表单中有很多都是自动将数据传到后台,然后通过实体来接受的,但是有的时候我们就是需要在前端就拿到这个Form表单的数据,这是我们就可以自己讲数据 ...

  9. # 详细了解HTML5中的form表单

    4.规范使用 <form>元素用于组织所有表单部件(也称为控件或字段),负责告诉浏览器把数据提交到哪里,方法是在action属性中提供一个URL.加入你只是想在客户端使用JavaScrip ...

  10. antd中的form表单 initialValue导致数据不更新问题

    初步理解 : initialValue就是所谓的defaultValue,只会在第一次赋值的时候改变,却又有一些不同,因为 initialValue又会因其他改动而改变. 然而当获取的数据重新上来要渲 ...

随机推荐

  1. 万众创业,互联网+,WTO

    WTO的保护期,发展的非常繁荣.但大部分的资源都配置在了房地产这个支柱产业, 而被保护的行业小日子过得不错, 研发再投入?那是傻子才做的事情,别墅.豪车.美女.这才是生活. 但突然有一天,发现保护期要 ...

  2. hdu4861 Couple doubi---2014 Multi-University Training Contest 1

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4861 Couple doubi Time Limit: 2000/1000 MS (Java/Othe ...

  3. 学习vi和vim编辑器(1):vi文本编辑器

    UNIX系统中有非常多编辑器.能够分为两种类型:行编辑器和全屏编辑器.行编辑器每次仅仅能在屏幕中显示文件的一行,如ed和ex编辑器.全屏编辑器能够在屏幕上显示文件的一部分. vi(读为vee-eye) ...

  4. ProjectRuler 算法练习之 位数组成字符串同样的整数

    Problem :It can be seen that the number, 125874, and its double, 251748, contain exactly the same di ...

  5. SpringMVC 拦截器不拦截静态资源的三种处理方式方法

    方案一.拦截器中增加针对静态资源不进行过滤(涉及spring-mvc.xml) <mvc:resources location="/" mapping="/**/* ...

  6. 现代英特尔® 架构上的 TensorFlow* 优化——正如去年参加Intel AI会议一样,Intel自己提供了对接自己AI CPU优化版本的Tensorflow,下载链接见后,同时可以基于谷歌官方的tf版本直接编译生成安装包

    现代英特尔® 架构上的 TensorFlow* 优化 转自:https://software.intel.com/zh-cn/articles/tensorflow-optimizations-on- ...

  7. Node.js:模块系统

    ylbtech-Node.js:模块系统 1.返回顶部 1. Node.js模块系统 为了让Node.js的文件可以相互调用,Node.js提供了一个简单的模块系统. 模块是Node.js 应用程序的 ...

  8. 10.TCPIP监听器

    给它做代理之后你这个端口是什么? 做一个代理. Local monitoring port:本地的监听端口.你要给谁做代理,那么给它做代理之后,你这个代理的端口是什么? 现在要给百度做一个代理. 能看 ...

  9. Javascript中数组重排序方法详解

    在数组中有两个可以用来直接排序的方法,分别是reverse()和sort().下面通过本文给大家详细介绍,对js 数组重排序相关知识感兴趣的朋友一起看看吧. 1.数组中已存在两个可直接用来重排序的方法 ...

  10. java MD5加密的工具类

    import java.security.MessageDigest; /** * MD5加密工具类 * @author zwq */ public class MD5Util { /** * MD5 ...