目录

知识补充

实现过程

前端代码

后端代码

简单分析


知识补充

表单简介(来自Mr._Dang)

action:提交的地址
  method:提交的方式
    get: 参数是在url中的,不安全,传输量比较少,不大于2KB。 默认是get
    post: 参数不在url中,相对比较安全。传输量没有限制。不过,服务器可能会对你传输的数据量进行限制。

input
  type:input元素的类型。会根据type的不同,呈现为不同的控件。
  name:提交的数据的名字
  
输入框
  type=text
  作用:创建一个允许用户输入的输入框。
  value:未输入之前的默认文本。
  placeholder:提示文本。
  maxlength:输入框最大输入字符长度。
  minlength:输入框最小的输入字符长度。
  autofocus:自动获取焦点   不需要书写属性值。
密码框
  password

单选
  radio
  属性:
    name:如果不设置name属性,浏览器不知道哪些单选框是一组,就不能起到单选的效果。我们需要给同一组的单选框添加一个相同的name属性值。
    checked:可以忽略属性值,表示当前单选默认选中。
    disabled 禁用 不仅仅是单选可用,别的input元素也可以使用。

多选
  checkbox
  name是必填项。而且同一组的多选框的name值必须相同。

按钮:
  value属性:按钮上的文字
  普通按钮
    button 配合js完成一些操作。
  提交按钮
    submit 将表单中的数据提交。
  重置按钮
    reset 重置表单中的数据

文件上传
  file
  文件上传时,需要在form表单中添加这样一个属性
        enctype="multipart/form-data"

label标签
  作用:为input元素添加标记。
    将label中的内容与input进行绑定,(input的id值),当鼠标点击label中的文本时,就会触发绑定的input元素。
  格式:
    <label for="要绑定的input元素的ID值">文本</label>

提交的数据形式: 键值对  =前面为键 =后面为值。
  account=张三四五六&sex=男

实现过程

前端代码

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=, initial-scale=1.0"><title>validata</title><style>#form{width: 600px;margin: 150px auto;padding: 10px;border: 1px solid #ddd;}</style><!-- 新 Bootstrap 核心 CSS 文件 -->
<link href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
</head>
<body><form id="form" action ="index.php" method="post"><div class="form-group"><label for="exampleInputEmail1">Email address</label><input type="email" class="form-control" id="exampleInputEmail1" placeholder="Email" name="email"></div><div class="form-group"><label for="exampleInputEmail1">Mobile</label><input type="text" class="form-control" id="exampleInputEmail1" placeholder="Mobile" name="mobile"></div><div class="form-group"><label for="exampleInputPassword1">Password</label><input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password" name="password"></div><button type="submit" class="btn btn-default">提交</button></form>
</body>
</html>

后端代码

<?php
$error=array();
if($_SERVER["REQUEST_METHOD"]==="POST")
{
if(empty($_POST["email"]))
{array_push($error,"注意,email为必填项");
}
else
{$email=checkValue($_POST["email"]);//规范处理if(!preg_match("/^\w+@\w+\.\w+$/",$email))array_push($error,"邮箱输入不合法");
}/* |w:数字 字母 下划线;+:可以有多个;^:起始位置;$:结束位置;.:任意字符,需要转义一下\.:转义后为普通字符.\d:一个字符的范围[0-9]{n}:需要出现n个字符{n,}:需要出现n个及n个以上的字符*/if(empty($_POST["mobile"]))
{array_push($error,"注意,mobile为必填项");
}
else
{$mobile=checkValue($_POST["mobile"]);//规范处理if(!preg_match("/^1\d{10}$/",$mobile))array_push($error,"手机号输入不合法");
}
if(empty($_POST["password"]))
{array_push($error,"注意,password为必填项");
}
else
{$password=checkValue($_POST["password"]);//规范处理if(!preg_match("/^\w{6,}$/",$password))array_push($error,"密码输入不合法");
}
}
function checkValue($value)
{
$data=trim($value);//移除字符串两侧的空白字符
$data=htmlspecialchars($data);//把预定义的字符转化为html的实体(&,",',<,>)
return $data;
}
$message=<<<EOT
<script>alert('$error[0]');history.go(-1);</script>
EOT;
if(count($error)>0)
{echo $message;
}
else{echo "注册成功";
}
?>

简单分析

前端分析

采取css模板实现了通过提交邮箱、手机号和密码进行登录的功能,此时前端通过type类型先对邮箱进行简单处理,发现需要输入@以及@后必须有内容,如图

后端分析

先确定请求方式为前端设置好的post并用empty函数判断输入是否为空,然后对输入的内容进行规范处理(trim去除两侧的空白字符,htmlspecialchars把预定义的字符转化为html的实体),再通过正则表达式判定输入的值是否合法,不合法则通过alert('$error[0]');history.go(-1)进行弹窗提示错误信息并返回上一级登录页面。

正则表达式进行格式

/* |w:数字 字母 下划线;
     +:可以有多个;
      ^:起始位置;
       $:结束位置;
    .:任意字符,需要转义一下
    \.:转义后为普通字符.
    \d:一个字符的范围[0-9]
    {n}:需要出现n个字符
    {n,}:需要出现n个及n个以上的字符

*/

PHP表单处理的案例分析相关推荐

  1. 掌财社:html5中AmazeUI框架中JS表单验证实战案例展示!

    今天和大家分享个有关于"html5中AmazeUI框架中JS表单验证实战案例展示!"这方面的相关内容知识,让大家对于html5中AmazeUI框架也可以有所了解! 1.需求 做一个 ...

  2. HTML 表格标签、列表标签、表单标签(案例: 注册页面)

    1. 表格标签 表格是实际开发中非常常用的标签: 1. 表格的主要作用 2. 表格的基本语法 1.1 表格的主要作用 表格主要用于显示.展示数据,因为它可以让数据显示的非常的规整,可读性非常好.特别是 ...

  3. php ajax 重复提交,ThinkPHP防止重复提交表单的方法实例分析

    本文实例总结分析了ThinkPHP防止重复提交表单的方法.分享给大家供大家参考,具体如下: 为什么会有表单重复的坑 在开发中,如果一个新增或修改的表单,在后台完成数据库操作后我们设定的不是跳转到其他页 ...

  4. phpcmsV9 表单向导(案例一)应用示例

    文章目录 phpcmsV9 表单向导:应用场景.使用教程(含效果图) 案例(一) ----- 应用场景 · 说明: ----- 应用 · 效果截图: 1. 前台表单 · 显示效果: 2. 后台数据查看 ...

  5. 【前端学习日志】HTML表格表单注册页面案例+CSS选择器

    今日学习 一.HTML部分 1.表格的基本语法 2.表头单元格标签 3.还是表头单元格标签 4.小说排行榜案例 5.合并单元格 6.无序列表 7.有序列表 8.自定义列表 9.表单域 10.Input ...

  6. jQuery插件表单验证插件案例

    目录 1.自定义插件: 2.第三方插件: 3.表单验证插件的案例: 一.自定义插件 好,我们今天来看看在jQuery里面如何去自定义一个插件,以及后面Leaf用一个案例来带大家看看如何运用别人写好了的 ...

  7. JavaScript表单信息验证案例——使用正则

    文章目录 展示 设计 完整代码 简约版 豪华版 展示 设计 首先建立我们的输入框 QQ号:<input type="text" id="txtQQ"> ...

  8. 表单引擎功能研究分析

    概述 表单引擎产品提供表单及视图快速定制.快速搭建部署, 高效运行支撑,尤其善于实现流程业务表单,与流程引擎完美结合.实现化繁为简.减少代码开发.缩短交付工期.降低交付成本的目标,打造软件行业产业链条 ...

  9. java爬虫隐藏表单提交_java爬虫--jsoup简单的表单抓取案例

    分析需求: 某农产品网站的农产品价格抓取 页面展示如上: 标签展示如上: 分析发现每日价格行情包括了蔬菜,水果,肉等所有的信息,所以直接抓每日行情的内容就可以实现抓取全部数据. 软件环境:eclips ...

最新文章

  1. 时频分析:短时傅里叶实现(3)
  2. spark-on-yarn安装centos
  3. pygame碰撞检测
  4. 有多个路由器的子网的分配
  5. MTK 驱动开发(18)---LCD 参数理解
  6. 关于android输入框被键盘遮挡的问题
  7. 软件工程2 需求获取
  8. 刷完 900 多道算法题的首次总结:LeetCode 应该怎么刷?
  9. win10双系统linux,win10系统linux双系统安装的操作方法
  10. Jaspersoft Studio 报表模板设计
  11. “芝诺大数据教学科研平台”荣获“2018大数据应用优秀案例”
  12. 【C++】输出公元1900-2100年之间所有闰年的年号,每5个一行
  13. 海康威视SDK二次开发通过云台参数设置控制摄像机的位置
  14. C++ iterator(迭代器)用法
  15. CP15 中的寄存器
  16. EXCEL批量删除单元格样式
  17. 【java校招你不知道的那些事儿】java校招不仅仅是春招秋招,具体有哪些阶段,特点是什么
  18. app.json: 未找到 [“pages“][2] 对应的 pages/goods_list/index.wxml 文件的问题解决办法
  19. STM32 SPI 软件NSS和硬件NSS解读
  20. SpringMVC框架个人笔记之响应数据、文件上传

热门文章

  1. 谱域GCN的一些基础知识总结
  2. linux 程序退出 调试,linux驱动程序调试常用方法(printk,OOP,strace,hacking,ioctl,/proc,kgdb)...
  3. ORACLE等待事件:read by other session
  4. 获取 postman 的 token
  5. 使用QrCode解析二维码
  6. 计算机网络码分多址CDMA及计算例题(简单易懂)
  7. python牛顿法与拟牛顿法_[机器学习必知必会]牛顿法与拟牛顿法
  8. ps人像精修教程——去除皱纹
  9. java企业物流管理系统 (JSP物流公司管理系统毕业设计)
  10. 产能利用率 (Capacity Utilization)