不刷新页面的PHP与Jquery AJAX文件上传

这里只拿图片上传做例子:

前端页面

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>多文件上传</title>
    </head>
    <body>
         <input id= "formfiles"  type="file" multiple />
          <br />
         <button id="sub_btn">提交</button> 
    </body>
    <script src="./js/jquery-3.1.1.min.js"></script>
    <script src="./js/form.js"></script>
</html>

js代码

$(document).ready(function(){
	$('#sub_btn').click(function(){
		var pic_data = new FormData();
		var filenum = $('#formfiles').get(0).files.length;
		for(var i = 0; i < filenum; i++){
			pic_data.append(i,$('#formfiles').get(0).files[i]);
		}
		
		$.ajax(
		{
			url:"./uploads.php",
			type: "POST",
			processData:false,
			contentType:false,
			data:pic_data,
			success:function(data){
				
				alert(data);
			}
		}
		);
	});
	
});



PHP代码

<?php
$file = $_FILES;
$num = count($file);
$result ='';
for($i=0;$i<$num;$i++){
    if(is_uploaded_file($file[$i]['tmp_name'])){
        
        $allowExt = array("image/png","image/gif","image/jpeg","image/jpg");
        if(!in_array($file[$i]['type'],$allowExt)){
            echo "不允许的类型<br />";
            continue;
        }
        
        $path = "./uploads/";
        $fname = date('YmdHis').rand(1000,9999);
        $ext = array_pop(explode('.',$file[$i]['name']));
        $newFile = $path.$fname.'.'.$ext;
        if(move_uploaded_file($file[$i]['tmp_name'],$newFile)){
            $n = $i + 1;
            $result = $result. "上传第{$n}张图片成功|";
        }else{
            $n = $i + 1;
            $result = $result."上传第{$n}张图片失败|";
        }
    }
}

echo $result;




猜你喜欢

转载自blog.csdn.net/zs2538596/article/details/62418746