1. 程式人生 > >TP3.2、tp3.2 thinkphp3.2 ajax檔案上傳

TP3.2、tp3.2 thinkphp3.2 ajax檔案上傳

注意:在linux要給上傳檔案的資料夾讀寫許可權

這種寫法也很好
 var form=document.getElementById("form1");
    var fd =new FormData(form);
    var attach_url = '';
    var attach = '';
    $.ajax({
      url: "{:U('Task/upload')}",
       type: "POST",
       data: fd,
       async: false,
       processData: false,  // 告訴jQuery不要去處理髮送的資料
       contentType: false,   // 告訴jQuery不要去設定Content-Type請求頭
       success: function(r,status,xhr){
        attach_url = r.data.url;
        attach = r.data.name;
        console.log(r);
      }
    });
一.html程式碼
(推薦這個)
  function uploads(){
        //new物件處理檔案上傳表單提交
        //‘#form1’是form的id,[0]是檔案上傳的下標,
        //我這裡只有一個input type=file所以就是[0]
        //這個[0]指的是第一個檔案上傳表單,不包含普通的input表單
        var data = new FormData($('#form')[0]);
          $.ajax({
            url: "{:U('Article/upload')}",//檔案地址
            type: 'POST',
            cache: false,//關閉快取
            data: data,

           //processData 預設為false,當設定為true的時候,
           //jQuery ajax 提交的時候不會序列化 data,而是直接使用data
           //processData設定為false。因為data值是FormData物件,不需要對資料做處理。

            processData: false,

          //contentType設定為false。因為是由<form>表單構造的FormData物件,
          //且已經聲明瞭屬性enctype="multipart/form-data",所以這裡設定為false

            contentType: false,
            success:function(data){
                $('#cover').val(data.file_url);
                alert(data.msg);
         }
      });
function uploads(id){
        //new物件處理檔案上傳表單提交
        //‘#form1’是form的id,[0]是檔案上傳的下標,
        //我這裡只有一個input type=file所以就是[0]
        //這個[0]指的是第一個檔案上傳表單,不包含普通的input表單
        var data = new FormData();
//第一個引數是input的ID可以自定義,第二個也是input的ID不是hiform的
        data.append(id,$("#"+id)[0].files[0]);
          $.ajax({
            url: "{:U('upload')}",//檔案地址
            type: 'POST',
            cache: false,//關閉快取
            data: data,

           //processData 預設為false,當設定為true的時候,
           //jQuery ajax 提交的時候不會序列化 data,而是直接使用data
           //processData設定為false。因為data值是FormData物件,不需要對資料做處理。

            processData: false,

          //contentType設定為false。因為是由<form>表單構造的FormData物件,
          //且已經聲明瞭屬性enctype="multipart/form-data",所以這裡設定為false

            contentType: false,
            success:function(r){
              // var url=$('#fileURL').val(data.fileURL);
              console.log(r);
              alert(r.msg);
         }
      });
    }
public function upload(){
 		 if(IS_POST){
      	$file = $_FILES;
     	 foreach ($file as $k => $v) {
          //生成唯一的ID
          $filename = md5(uniqid(microtime(true),true));
          if($file[$k]['error']==0){
            $config=array(
                'maxSize'=>70000000,
                'exts'=>array('jpg','jpeg','png','gif'),
                'rootPath'=>'./uploads/',
                //儲存的檔名
                'saveName'   =>$filename,
                //開啟子目錄
                'subName'    =>array('date','Ymd'),
            );
            $upload=new \Think\Upload($config);
            $info=$upload->upload();
            if($info){
              //域名
              $ym='http://yun.zjwhtb.net';
              //根目錄
              $rootPath=substr($config['rootPath'],1);
              //檔案儲存路徑
              $savepath=$info[$k]['savepath'];
              //檔名稱
              $savename=$info[$k]['savename'];
              $fileUrl = $ym.$rootPath.$savepath.$savename;
                $data['msg']='檔案上傳成功';
                $data['fileUrl']=$fileUrl;
                // dump($data);die;
                $this->ajaxReturn($data);
            }else{
                $data['msg']=$upload->getError();
                // dump($data);die;
                $this->ajaxReturn($data);
            }
          
          }else{
            $data['msg']='檔案上傳錯誤';
             // dump($data);die;
            
            $this->ajaxReturn($data);
          }
      }

    }else{
       $this->display();

    }
  }