本文实例为大家分享了php表单文件iframe异步上传的具体代码，供大家参考，具体内容如下
1.表单中放置iframe元素；
2.文件上传控件内容变化的时候触发JS设置表单的action为处理文件上传的img_upload_process.php文件，并且将表单的target设置为iframe，让iframe去提交到服务器进行文件上传；
3.img_upload_process.php中处理文件上传成功后，将上传成功保存的文件路径回传给表单中隐藏域；
4.点击表单提交按钮的时,JS设置表单action为接收表单数据的form_process.php文件，表单的target设置为_self。
表单：asyn_uplaod.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>图片异步上传</title>
</head>
<body>
<!-- application/x-www-form-urlencoded 缺省编码类型 -->
<!-- multipart/form-data 多媒体传输协议 ,方法必须是post 既可以发送文本数据，也支持二进制数据上载 -->
<form action="" method="post" enctype="multipart/form-data">
用户名: <input type="text" name="username" /><br />
上传头像: <input type="file" id="avator" name="avator" onchange="startUpload(this.form)" />
<iframe frameborder="0" width="0" height="0" name="uploadframe"></iframe>
<input type="hidden" id="save_path" name="save_path" />
<span id="loading"></span> <br />
<img width="100" height="100" id="uploaded_img" /> <br />
<input type="submit" name="submitted" value="提交" onclick="formSubmit(this.form)" />
</form>
<script>
function startUpload(formObj){
document.getElementById("loading").innerHTML = "上传中...";
formObj.action = "img_upload_process.php";
formObj.target = "uploadframe";
formObj.submit();
}
function formSubmit(formObj) {
formObj.action = "form_process.php";
formObj.target = "_self";
//清空文件上传内容，防止重复提交
var fileObj = document.getElementById("avator") ;
// for IE, Opera, Safari, Chrome
if (fileObj.outerHTML) {
fileObj.outerHTML = fileObj.outerHTML;
} else { // FF(包括3.5)
fileObj.value = "";
}
formObj.submit();
}
</script>
</body>
</html>
处理文件上传：img_upload_process.php
<?php
include "Upload.class.php";
$file = $_FILES["avator"];
$upload = new Upload();//上传工具类对象
if($save_path = $upload->up($file)){//上传成功
echo <<<STR
<script>
window.parent.document.getElementById("uploaded_img").src = "$save_path";
window.parent.document.getElementById("loading").innerHTML = "上传成功";
window.parent.document.getElementById("save_path").value = "$save_path";
</script>
STR;
}else{
$error = $upload->error();
echo <<<STR
<script>
window.parent.document.getElementById("uploaded_img").src = "";
window.parent.document.getElementById("loading").innerHTML = "上传失败: $error";
</script>
STR;
}
文件上传工具类：Upload.class.php
<?php
class Upload{
private $path; //文件上传目录
private $max_size; //上传文件大小限制
private $errno; //错误信息号
private $mime = array("image/jpeg","image/png","image/gif");//允许上传的文件类型
/**
* 构造函数,
* @access public
* @param $path string 上传的路径
*/
public function __construct($path = "./" ){
$this->path = $path;
$this->max_size = 1000000;
}
/**
* 文件上传的方法，分目录存放文件
* @access public
* @param $file array 包含上传文件信息的数组
* @return mixed 成功返回上传的文件名，失败返回false
*/
public function up($file){
//判断文件是否是通过 HTTP POST 上传，防止恶意欺骗
/*
if (! is_uploaded_file($file["tmp_name"])) {
$this->errno = 5; //设置错误信息号为5，表示非法上传
return false;
}
*/
//判断是否从浏览器端成功上传到服务器端
if ($file["error"] == 0) {
# 上传到临时文件夹成功,对临时文件进行处理
//上传类型判断
if (!in_array($file["type"], $this->mime)) {
# 类型不对
$this->errno = -1;
return false;
}
//判断文件大小
if ($file["size"] > $this->max_size) {
# 大小超出配置文件的中的上传限制
$this->errno = -2;
return false;
}
//获取存放上传文件的目录
$sub_path = date("Ymd")."/";
if (!is_dir($this->path . $sub_path)) {
# 不存在该目录，创建之
mkdir($this->path . $sub_path);
}
//文件重命名,由当前日期 + 随机数 + 后缀名
$file_name = date("YmdHis").uniqid().strrchr($file["name"], ".");
//准备就绪了，开始上传
if (move_uploaded_file($file["tmp_name"], $this->path . $sub_path . $file_name)) {
# 移动成功
return $sub_path . $file_name;
} else {
# 移动失败
$this->errno = -3;
return false;
}
} else {
# 上传到临时文件夹失败，根据其错误号设置错误号
$this->errno = $file["error"];
return false;
}
}
/**
* 多文件上传方法
* @access public
* @param $file array 包含上传文件信息的数组，是一个二维数组
* @return array 成功返回上传的文件名构成的数组, ?如果有失败的则不太好处理了
*/
public function multiUp($files){
//在多文件上传时，上传文件信息 又是一个多维数组，如$_FILES["userfile"]["name"][0]，$_FILES["userfile"]["name"][1]
//我们只需要遍历该数组，得到每个上传文件的信息，依次调用up方法即可
foreach ($files["name"] as $key => $value) {
# code...
$file["name"] = $files["name"][$key];
$file["type"] = $files["type"][$key];
$file["tmp_name"] = $files["tmp_name"][$key];
$file["error"] = $files["error"][$key];
$file["size"] = $files["size"][$key];
//调用up方法，完成上传
$filename[] = $this->up($file);
}
return $filename;
}
/**
* 获取错误信息,根据错误号获取相应的错误提示
* @access public
* @return string 返回错误信息
*/
public function error(){
switch ($this->errno) {
case -1:
return "请检查你的文件类型，目前支持的类型有".implode(",", $this->mime);
break;
case -2:
return "文件超出系统规定的大小，最大不能超过". $this->max_size;
break;
case -3:
return "文件移动失败";
break;
case 1:
return "上传的文件超过了 php.ini 中 upload_max_filesize 选项限制的值,其大小为".ini_get("upload_max_filesize");
break;
case 2:
return "上传文件的大小超过了 HTML 表单中 MAX_FILE_SIZE 选项指定的值,其大小为" . $_POST["MAX_FILE_SIZE"];
break;
case 3:
return "文件只有部分被上传";
break;
case 4:
return "没有文件被上传";
break;
case 5:
return "非法上传";
break;
case 6:
return "找不到临时文件夹";
break;
case 7:
return "文件写入临时文件夹失败";
break;
default:
return "未知错误,灵异事件";
break;
}
}
}
处理表单提交：form_process.php
<?php var_dump($_REQUEST); var_dump($_FILES);
点击表单提交按钮结果：
代码下载：php表单文件iframe异步上传
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持网页设计。
