jquery.fileupload文件上传

郭浩穰
2023-12-01
JS:
$(function () {
			//文件上传地址
			//var url = 'http://localhost/index.php/upload/do_upload';
			var url = 'http://localhost/index.php/uploadwe';
			//初始化,主要是设置上传参数,以及事件处理方法(回调函数)
			$('#fileupload').fileupload({
				autoUpload: true,//是否自动上传
				//url: url,//上传地址
				dataType: 'json',
				done: function (e, data) {//设置文件上传完毕事件的回调函数
					//$.each(data.result.files, function (index, file) {
					$("#myimg").attr({src:data.result.imgurl});
					$("#myimg").css({width:"290px",height:"218px"});
					//alert(data.result);
				},
				progressall: function (e, data) {//设置上传进度事件的回调函数
					var progress = parseInt(data.loaded / data.total * 5, 10);
					$('#progress .bar').css(
						'width',
						progress + '%'
					);
				}
			});
		}); 

上传至服务后,服务器返回json数据--上传图片的地址。


HTML:

<label for="text">上传图片</label>
<input id="fileupload" type="file" name="files" data-url="jquery_save_img" multiple>

data-url为上传至服务器端的处理接口/地址,可替换js中的url


服务器端:

function jquery_save_img()
	{
		$arrType=array('image/jpg','image/gif','image/png','image/bmp','image/pjpeg','image/jpeg');
		$max_size='500000000000';      // 最大文件限制(单位:byte)
		$upfile='./uploads'; //图片目录路径
		$file=$_FILES['files'];

		/*
		echo 'filename:'.$file['tmp_name'].';<br />';
		echo 'size:'.$file['size'].';<br />';
		echo 'type:'.$file['type'].';<br />';
		echo 'name:'.$file['name'].';<br />';
		*/
		
		if($_SERVER['REQUEST_METHOD']=='POST'){ //判断提交方式是否为POST
			if(!is_uploaded_file($file['tmp_name'])){ //判断上传文件是否存在
				echo "<font color='#FF0000'>文件不存在!</font>";
				exit;
			}

			if($file['size']>$max_size){  //判断文件大小是否大于500000字节
				echo "<font color='#FF0000'>上传文件太大!</font>";
				exit;
			} 
			if(!in_array($file['type'],$arrType)){  //判断图片文件的格式
				echo "<font color='#FF0000'>上传文件格式不对!</font>xxx:".$file['type'];
				exit;
			}
			if(!file_exists($upfile)){  // 判断存放文件目录是否存在
				mkdir($upfile,0777,true);
			} 
			$imageSize=getimagesize($file['tmp_name']);
			$img=$imageSize[0].'*'.$imageSize[1];
			$fname=$file['name'];
			$ftype=explode('.',$fname);
			$picName=$upfile."/cloudy".$fname;

			if(file_exists($picName)){
				//echo "<font color='#FF0000'>同文件名已存在!</font>";
				//exit;
			}
			if(!move_uploaded_file($file['tmp_name'],$picName)){  
				echo "<font color='#FF0000'>移动文件出错!</font>";
				exit;
			}
			else{
			/*
				echo "<font color='#FF0000'>图片文件上传成功!</font><br/>";
				echo "<font color='#0000FF'>图片大小:$img</font><br/>";
				echo "图片预览:<br><div style='border:#F00 1px solid; width:200px;height:200px'>
				<img src=\"".$picName."\" width=200px height=200px>".$fname."</div>";
			*/
				echo '{"imgurl":"http://localhost/uploads/cloudy'.$fname.'"}';
			}
		}
	
	}


 类似资料: