1. 程式人生 > >Ajaxfileupload多個input上傳圖片

Ajaxfileupload多個input上傳圖片

頁面

html

<label class="layui-icon">&#xe63c;
<input type="file" class="fileicon" value="" title="支援jpg、jpeg、gif、png格式,檔案小於	5M" onchange="uploadFile({$vo.id});" name="image" id="{$vo.id}" />
</label>
將input迴圈出的 {$vo.id} 賦給 id ,用於 fileElementId: id,接收動態值。

js

function uploadFile(id) {
        $.ajaxFileUpload({
		   type: 'post',
           url : "__URL__/upload",
		   data: {id:id},
           secureuri: false,
           fileElementId: id,
           dataType: 'json',
           success: function (data)  //伺服器成功響應處理函式
           {
            console.log(data);
				if(data==1){
					alert("上傳成功");
				}else{
					alert("上傳失敗"); return false;
				}
           },
       })
   }

php(tp3.2)

   //上傳報告
public function upload(){
	$id = I('id');
	//$this->ajaxReturn($_FILES); //這裡檢視上傳檔案資訊
	if($_FILES){
		$upload = new \Think\Upload();// 例項化上傳類
		$upload->maxSize   =     3145728 ;// 設定附件上傳大小
		$upload->rootPath  =     APP_ROOT; // 設定附件上傳根目錄
		$upload->savePath  =     ''; // 設定附件上傳(子)目錄
		// 上傳檔案
		$info   =   $upload->upload();
		$img1="/uploads/".$info['image']["savepath"].$info['image']["savename"];
		if(!empty($id)){
			$res = M()->execute('update js_testing_currency set presentation = "'.$img1.'",status = "1" where id='.$id.'');
			$this->ajaxReturn($res);
		}
		
		}
}