博客列表 >图片上传-2018年4月20日

图片上传-2018年4月20日

小小的菜的博客
小小的菜的博客原创
2018年04月23日 15:31:32605浏览

错误的异步,还需要再研究一下


实例

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style type="text/css">
		.file-box{

			display: inline-block;

			position: relative;

			padding: 3px 5px;

			overflow: hidden;

			color:#fff;

			background-color: #ccc;

		}

		.file-btn{

			position: absolute;

			width: 100%;

			height: 100%;
			
			top: 0;

    		left: 0;

    		outline: none;

    		background-color: transparent;

    		filter:alpha(opacity=0);

			-moz-opacity:0;

			-khtml-opacity: 0;

			opacity: 0;

		}

	</style>
</head>
<body>
	<form action="<?php echo htmlspecialchars($_SERVER['PHP_SELF']) ?>" method="post" enctype="multipart/form-data">
		<input type="hidden" name="MAX_FILE_SIZE" value="542488">
		<fieldset>
			<legend align="center">文件上传</legend>
			<p><label for="upload"><strong>选择文件:</strong></label><input type="file" name="upload" id="upload">
			<span><button type="submit" name="submit" id="submit">上传</button></span></p>
		</fieldset>
	</form>
	<!-- 改变上传默认样式 -->
	<!-- <form action="" method="post" enctype="multipart/form-data">
		<input type="hidden" name="MAX_FILE_SIZE" value="542488">
		<fieldset>
			<legend align="center">文件上传</legend>
			<div class="file-box">
				<input type="file" name="upload" class="file-btn" id="upload">上传文件
			</div>
			<span><button type="submit" name="submit">上传</button></span></p>
		</fieldset>
	</form> -->

	<script type="text/javascript" src="../js/jquery.js"></script>
	<script type="text/javascript">
		$('#submit').click(function(){
			$.post('$_SERVER['PHP_SELF']','upload='+$('#upload').val(),function(data){
				switch(data.status){
					case 0;
					$('button').find('span').remove()
					$('#submit').after('<span>').next().text(data.msg).css('color','green')
					// $('#upload').befor('<img src=""')
					break;
					case 1;
					$('button').find('span').remove()
					$('#submit').after('<span>').next().text(data.msg).css('color','red')
					break;
					case 1;
					$('button').find('span').remove()
					$('#submit').after('<span>').next().text(data.msg).css('color','red')
					break;
				}
			},'json')
		})
	</script>

	<?php 
	if ($_SERVER['REQUEST_METHOD'] == 'POST') {
		if (isset($_FILES['upload'])){
			$file_typ = ['image/jpg','image/jpeg','image/png'];
			if (in_array($_FILES['upload'],$file_typ)) {
				if (move_uploaded_file($_FILES['upload']['tmp_name'], "upload{$_FILES['upload']['name']}")){
					exit json_encode('status'=> 0,'msg'=>'上传成功')
				}
			}
			else {
			exit json_encode('status'=> 1,'msg'=>'文件类型错误');
			}
		}
		
	}else {
		exit json_encode('status'=> 2,'msg'=>'请求类型错误')

	}


	?>

</body>
</html>

运行实例 »

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


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