一个非常简单的HTML页面，支持选择文件上传，支持手机和电脑，可以同时支持单个表单里面，同时上传文件内容和表单参数！
A very simple & single html/PHP upload script to allow combine HTML form parameter and file both.
Submit HTML form data as a file / Combine form data + file and send as single file in HTML form and accept by PHP
其关键在于，HTML form中，要用multipart/form-data类似代码：
<form enctype="multipart/form-data" action="upload.php" method="POST">
然后服务器可以使用 $_POST['form param name'] 的方式来获取表单中的参数，用$_FILES来获取上传的文件信息（可以支持多个文件！！！）！
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>上传照片</title>
<style>
input[type="button"], input[type="submit"], input[type="reset"] ,
botton,bottom {
-webkit-appearance:none;
}
.file {
position: relative;
display: inline-block;
background: #D0EEFF;
border: 1px solid #99D3F5;
border-radius: 4px;
padding: 4px 12px;
overflow: hidden;
color: #1E88C7;
text-decoration: none;
text-indent: 0;
width:92%;
line-height: 20px;
}
.file input {
position: absolute;
font-size: 100px;
right: 0;
top: 0;
opacity: 0;
}
.file:hover {
background: #AADFFD;
border-color: #78C3F3;
color: #004974;
text-decoration: none;
}
input[type=submit] {
background: #64b448;
color: white;
border-style: outset;
border-color: #64b448;
height: 50px;
width: 100px;
font: bold 15px arial, sans-serif;
text-shadow:none;
}
input {
height:25px;
font-size:16px;
}
</style>
<script>
function setImg() {
var docObj = document.getElementById("imgPath");
var files = document.getElementById("imgPath").value;
if (docObj.files && docObj.files[0]) {
var img = new Image();
img.onload = function(){
var width = img.width;
var height= img.height;
if (width / height > 268 / 320 || width / height < 252 / 320){
alert('图片尺寸不符合规范，请更新宽高比为260*320(0.8125)的图片，当前图片大小为 ' + width + "×" + height + "，比例为: " + width / height);
}
};
img.onerror=function(){
alert("图片加载错误!");
};
img.src=window.URL.createObjectURL(docObj.files[0]);
}
}
</script>
</head>
<body>
<p><font size="+1">照片要求</font><ol>
<li><font color="blue">淡蓝色背景颜色</font>，近期正面免冠彩色头像数码照（一寸照片即可，在采集时，只要相差不大就没有问题）</li>
<li>照片规格：<font color="red">260(宽)*320(高)(0.8125比例)，分辨率150dpi以上</font>。</li>
<li>人像在相片矩形框内水平居中，头部占照片尺寸的2／3，常戴眼镜的学生应配戴眼镜，人像清晰，层次丰富，神态自然，无明显畸变。</li>
<li>数码照片要求为jpg格式。</li>
<li>照片文件大小应小于60K。</li>
</ol>
</p>
<form enctype="multipart/form-data" action="upload.php" method="POST">
班级: <input type="text" name="class" placeholder="班号" style="width:92%" value="2017103"><br/>
姓名: <input type="text" name="name" placeholder="姓名" style="width:92%" value="<?PHP echo $_POST['name']?>"><br/>
请选择照片: <input id="imgPath" type="file" name="photo" accept="image/jpeg" class="file" onchange="setImg()"></input><br/><br/>
<input type="submit" value="开始上传"></input>
</form>
<?PHP
if(!empty($_FILES['photo']))
{
if ( isset($_POST['name']) && isset($_POST['class']) ) {
$name = trim($_POST['name']);
$class = trim($_POST['class']);
if (($name == "" || $class == "")) {
echo "班级和姓名不能为空。";
return ;
}
$path = "uploads/";
$path = $path . "xxxxxxxx_" . $class . "_" . $name . ".jpg";
// $path = $path . basename( $_FILES['photo']['name']);
$imgage = getimagesize($_FILES['photo']['tmp_name']);
$src_w = $imgage[0]; //获取大图片宽度
$src_h = $imgage[1]; //获取大图片高度
$w = 260;
$h = (1.0 * 260 / $src_w) * $src_h;
$dst_im = imagecreatetruecolor($w, $h);
$src_im = @imagecreatefromjpeg($_FILES['photo']['tmp_name']);
imagecopyresampled($dst_im, $src_im, 0, 0, 0, 0, $w, $h, $src_w, $src_h);
if ( ($src_w <= 260) && ($_FILES['photo']['size'] < 60 * 1024)) {
if(move_uploaded_file($_FILES['photo']['tmp_name'], $path)) {
echo "文件 ". basename( $_FILES['photo']['name']). " 已经上传。<br/><img src=\"" . $path . "\" />";
} else{
echo "文件上传出错。";
}
} else {
imagejpeg($dst_im, $path, 95);
echo "<p>文件" . basename( $_FILES['photo']['name']). " 已经上传并自动转成符合格式要求的图片。<br/><img src=\"" . $path . "\" /></p>";
}
} else {
echo "班号和姓名不能为空！";
}
}
?>
</body>
</html>