网络编程 
首页 > 网络编程 > 浏览文章

PHP+AjaxForm异步带进度条上传文件实例代码

(编辑:jimmy 日期: 2024/11/17 浏览:3 次 )

在使用ajaxForm方法之前,首先需要安装form.js的插件,网上有;

一、首先说用法,ajaxForm可以接收0或1个参数,该参数可以是一个变量、一个对象或回调函数,这个对象主要有以下参数:

var object= {
           url:url,      //form提交数据的地址
       type:type,    //form提交的方式(method:post/get)
       target:target,  //服务器返回的响应数据显示的元素(Id)号
           beforeSerialize:function(){} //序列化提交数据之前的回调函数
       beforeSubmit:function(){},  //提交前执行的回调函数
       success:function(){},      //提交成功后执行的回调函数
           error:function(){},       //提交失败执行的函数
       dataType:null,       //服务器返回数据类型
       clearForm:true,       //提交成功后是否清空表单中的字段值
       restForm:true,       //提交成功后是否重置表单中的字段值,即恢复到页面加载时的状态
       timeout:6000         //设置请求时间,超过该时间后,自动退出请求,单位(毫秒)。  

}
ajaxForm js的code
$(function(){
  $("form").ajaxForm(object);
})

实例具体代码code

htmlcode

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=7" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="ROBOTS" content="NOODP">
<title>PHP+Ajax异步带进度条上传文件实例_php</title>
<meta http-equiv="X-UA-Compatible" content="IE=EDGE" />
<meta name="keywords" content="php,ajax异步上传文件,ajax,异步加载,进度条,php,ajax上传进度条" />
<meta name="description" content="这篇文章主要介绍了PHP+Ajax异步带进度条上传文件实例代码。" />
<!--默认的进度条样式文件
添加一个带有 class .progress 的 <div>。
接着,在上面的 <div> 内,添加一个带有 class .progress-bar 的空的 <div>。
添加一个带有百分比表示的宽度的 style 属性,例如 style="60%"; 表示进度条在 60% 的位置
-->
<link rel="stylesheet" href="public/css/bootstrap.min.css" rel="external nofollow" > 
<script src="/UploadFiles/2021-04-02/jquery.min.js">

php上传上传类upload.class.php文件

<"PRC"); //设置时间区域
//上传类
class upload{
 protected $file_path = "files"; //当前files存储文件夹
 protected $file_size = 5120000; //5M 用户上传
 /**
 *检测文件是否为空
 */
 public function check_file($get_file)
 {
  if (empty($get_file))
  {
    $type = "check_file";
    $arr = array('error'=>'empty_name','type'=>$type);
    echo json_encode($arr);
    exit();
  }
 return true;
 }
 /**
 *检测文件类型
 */
 public function check_type($get_type)
 {
  if (( $get_type == ".docx" ) || ( $get_type == ".doc" )) {
   //这里只是判断上传word文档可以自己添加
  }else{
   $type = "check_type";
   $arr = array('error'=>'format','type'=>$type);
    echo json_encode($arr);
    exit(); 
  }
 return true;
 }
 /**
 *检测文件大小
 */
 public function check_size($get_file)
 {
  if ( $get_file != "" ) {
   if ( $get_file > $this->file_size ) {
     $arr = array('error'=>'large');
     echo json_encode($arr);
     exit();
   }
 }else{
  return false;
  exit();
 }
 return true;
 }
 /**
 *文件保存
 */
 public function save_file($file_type,$file_tmp_name)
 {
 $rand = rand(1000, 9999);
 $pics =date('YmdHis') . $rand . $file_type;
 $path = $this->file_path."/".$pics;
 $result = move_uploaded_file($file_tmp_name, $path);
 if($result){
  return $pics;
 }else{
  return false;
  exit();
 }
 }
}
"htmlcode">
<"upload.class.php");
$up_obj = new upload();
//获取上传文件名
$get_fileName = $_FILES['mypic']['name']; 
$get_fileSize = $_FILES['mypic']['size'];
$get_TmpFiles = $_FILES['mypic']['tmp_name'];
$get_fileType = strstr($get_fileName, '.');
$check_result = $up_obj->check_file($get_fileName);
if($check_result){
 $result_type = $up_obj->check_type($get_fileType);//检查文件类型
 if($result_type){
  $result_size = $up_obj->check_size($get_fileSize);//检查文件大小
  if($result_size){
   $pics = $up_obj->save_file($get_fileType,$get_TmpFiles); //文件上传保存   
   $size = round($get_fileSize/1024,2);
     $arr = array(
      'name' => $get_fileName,
       'pic' => $pics,
       'size'=> $size,
       'error' => 2,
       'list' =>$_POST['list']
     );
    if($pics){ //检查文件上传状态
     echo json_encode($arr);
   }  
  }
 }
}
"color: #ff0000">总结

以上所述是小编给大家介绍的PHP+AjaxForm异步带进度条上传文件实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!

上一篇:IOS 开发之NSDictionary转换成JSON字符串
下一篇:利用laravel搭建一个迷你博客实战教程
在去年的5月23日,借助Intel Bridge Technology以及Intel Celadon两项技术的驱动,Intel为PC用户带来了Android On Windows(AOW)平台,并携手国内软件公司腾讯共同推出了腾讯应用宝电脑版,将Windows与安卓两大生态进行了融合,PC的使用体验随即被带入到了一个全新的阶段。