博客列表 >Ajax实现上传文件 20180422-15:09

Ajax实现上传文件 20180422-15:09

AsNwds_MIS王的博客
AsNwds_MIS王的博客原创
2018年04月22日 15:14:11577浏览

实例

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
<table width="500" border="0" cellpadding="0" cellspacing="0">
	<form action="" method="post" enctype="multipart/form-dara">
		<tr>
			<td width="150" height="30" align="right" valign="middle">请选择上传的文件:</td>
			<td width="250"><input type="file" name="upfile"></td>
			<td width="100"><button>上传</button></td>
		</tr>

	</form>

</table>

	
</body>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script>


	$('button').click(function(){
		var formData=new FormData();
		var files=document.getElementById('upfile');
		var file=files.files[0];

		formData.append('upfile',file);
		$.ajax({
			url:'upload.php',
			type:'POST',
			data:formData,
			processData : false,
			contentType : false,
			// async:false,
			success:function(res){
				console.log(res);
			}
		})
		return false;
	})
</script>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

php部分

实例

<?php 
	
	//检测请求类型是否POST,如果不是应该提示用户类型不对
	if ($_SERVER['REQUEST_METHOD'] == 'POST') {
		//检测是否有文件被上传
		if (isset($_FILES['upfile'])) {
			//设置允许上传的文件类型
			$allow = ['image/jpg','image/jpeg', 'image/png'];
			if (in_array($_FILES['upfile']['type'], $allow)) {
				//将文件先移动到临时目录
				if (move_uploaded_file($_FILES['upfile']['tmp_name'], "upload/{$_FILES['upfile']['name']}")){
					//上传成功
					echo "<script>alert('文件上传成功')</script>";
				} 
			}else {
					//提示格式不对
					echo "<script>alert('仅允许上传jpg和png格式的图片')</script>";
				}
		}
		//对上传错误进行处理
		if ($_FILES['upload']['error'] > 0 ) {
			echo '<p>错误原因是:<strong>';

			switch ($_FILES['upfile']['error']) {
				case 1:
					echo '文件超过了php.ini配置中设置的大小';
					break;
				case 2:
					echo '文件超过了表单中常量设置的大小';
					break;
				case 3:
					echo '仅有部分文件被上传';
					break;
				case 4:
					echo '没有文件被上传';
					break;
				case 6:
					echo '没有可用的临时文件夹';
					break;
				case 7:
					echo '磁盘已满,写入失败';
					break;
				case 8:
					echo '上传意外中止';
					break;
				
				default:
					echo '系统未知错误';
					break;
			}

			echo '</strong></p>';
			//保险起见,最好把创建的临时文件删除,当然系统也会在结束会话时自动清空
			if (file_exists($_FILES['upfile']['tmp_name']) && is_file($_FILES['upfile']['tmp_name'])) {
				unlink($_FILES['upfile']['tmp_name']);
			}
		}
	} else {
		echo '1';
	}
?>

运行实例 »

点击 "运行实例" 按钮查看在线实例

<form> 标签的 enctype 属性规定了在提交表单时要使用哪种内容类型,比如文件内容,请使用 "multipart/form-data"。

<input> 标签的 type="file" 属性规定了应该把输入作为文件来处理

第一个参数是表单的 input name,第二个下标可以是 "name", "type", "size", "tmp_name" 或 "error"。就像这样:

$_FILES["file"]["name"] - 被上传文件的名称

$_FILES["file"]["type"] - 被上传文件的类型

$_FILES["file"]["size"] - 被上传文件的大小,以字节计

$_FILES["file"]["tmp_name"] - 存储在服务器的文件的临时副本的名称

$_FILES["file"]["error"] - 由文件上传导致的错误代码

move_uploaded_file()函数上传文件,成功返回 true,失败false

声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议