iframe实现无刷新上传文件并在当前页面返回数据php处理方式

iframe框架无刷新上传文件的原理

from表单提交数据到到iframe框架，通过无刷新后代处理数据上传文件

在后台处理页面通过js的window.parent获取父页面，在父页面中输出上传文件获得的数据

index.php页面的代码

<meta charset="utf-8">
<iframe name="upload" style="display:none" src=""></iframe>
<form action="upload.php" method="post" enctype="multipart/form-data" target="upload">
<input type="hidden" name="filetype" value="img">
<input type="file" name="img">
<input type="hidden" name="MAX_FILE_SIZE" value="102400"> 
<input type="submit" value="上传"> 
</form>
<input type="text" id="thumb" value="">

这里需要注意的是iframe中的name="upload"一定要与from中的target="upload的值相等"

这里相当于iframe包含了一个upload.php的页面

所以index.php是父页面

upload.php的页面代码

<?php
//文件上传类，上传文件大小一字节KB为单位注意填写大小，上传的路径请填写绝对地址路径
//上传成功返回文件的路径
class uploads{
	public $maxsize;//上传文件在最大值
	public $filetype;//允许上传的文件类型
	public $savename;//保存的文件名
	public $filepath;//文件保存的路径
	public $error;//错误信息
	public $ext;//上传文件的扩展名
	/**
	构造方法设置上传配置
	*/
	function __construct($maxsize,$filetype,$savename,$filepath){
		$this->maxsize=$maxsize;
		$this->filetype=$filetype;
		$this->savename=$savename;
		$this->filepath=$filepath;
	}
	/**
	$filearr文件上传数组$_FILES['name']
	$savename 文件保存的文件名称
	$maxsize 允许文件上传的最大大小
	$fieltype 允许上传文件的类型
	$filepath 文件上传的路径
	*/
	public function upload($filearr){
		if($this->check_type($filearr)==false) return $this->error;
		$this->get_exe($filearr);
		if($this->check_ext()==false) return $this->error;
		$this->savename();
		if(($paths=$this->createdir())==false) return '目录创建失败，请检查文件权限';
		if(move_uploaded_file($filearr['tmp_name'],$paths.'/'.$this->savename.'.'.$this->ext)){
			//$this->error='文件上传成功';
			//return $paths.'/'.$this->savename.'.'.$this->ext;
			return '/'.$this->savename.'.'.$this->ext;
		}else{
			$this->error='文件上传失败';
			return $this->error;
		}
		

	}
	//检查文件大小和错误和允许上传的文件类型
	public function check_type($filearr){
		$a=$filearr['error'];
		$data=array(0=>'无错误，上传成功',1=>'上传文件的大小超过了服务器的最大配置',2=>'上传的值超过了表单中允许的最大值',3=>'文件没有被全部上传',4=>'没有文件被上传',6=>'找不到临时文件目录',7=>'文件写入失败');
		if($a!=0){
			$this->error=$data[$a];
			return false;
		}
		$size=$filearr['size']/1024;
		if($size>$this->maxsize){
			$this->error='文件上传大小超过系统限制';
			return false;
		}
		return true;
	}
	//按照日期创建目录
	public function createdir(){
		$path=$this->filepath.'/'.date('Ymd',time());
		if(!is_dir($path)){
			mkdir($path,0777,true)?$path:false;
		}
		return $path;

	}
	//获取文件的扩展名
	public function get_exe($filearr){
		$ext = explode(".", $filearr['name']);
        $ext = $ext[count($ext) - 1];
        $this->ext=$ext;
	}
	//检测上传文件的扩展名
	public function check_ext(){
		$arr=explode('|', $this->filetype);
		if(!in_array($this->ext, $arr)){
			$this->error='不允许该类文件上传';
			return false;
		}else{
			return true;
		}
	}
	//文件上传的保存文件名,文件名不存在设置按日期随机名称
	public function savename(){
		if($this->savename==''){
			$name=date('mdHi').rand(100,10000);
			$this->savename=$name;
		}else{
			return true;
		}

	}
	//删除文件
	public function delupload($file){
        if(!@unlink($file))
        {
            $this->errno = 3;
            return false;
        }
        return true;
    }
}

//以上是文件上传的类，成功则返回保存的文件名和文件后缀名

$kk=dirname(__FILE__);
$a=new uploads(1000000000,'jpg|png|gif|zip|rar','',$kk);
if(isset($_FILES['img'])){
	$qw=$a->upload($_FILES['img']);
}
$qw='http://192.168.1.122/test/if/'.date('Ymd',time()).$qw;
?>
//这里的js代码是处理数据输出到上传的页面
<script src="./jquery.js"></script>
<script>
     var p=window.parent;//获取父页面，即时index.php页面
     var filetype='<?php echo $_POST['filetype'];?>';
    //如果是上传图片，就将上传图片的地址输出到父页面的input框中
     switch(filetype){
         case "img":
             var thumb=$(p.document.getElementById("thumb"));
             thumb.val("<?php if(isset($qw)) echo $qw;?>");
             break;
     }
</script>

效果图，点击上传后的效果