图片上传并在php jQuery中显示错误

时间:2015-10-19 09:24:00

标签: php jquery

我正在尝试使用以下代码更改个人资料图片。它允许少量格式和大小小于2mb,如果不是这样,它将给出错误。上传效果很好但错误有问题,选择代码或图片不允许的图像类型超过2mb它既不上传图像也不显示错误只是进度条完成其过程但没有图像被更改或上传到数据库也没有显示任何错误,我想在图像高于2mb或代码不允许的格式时出错。

imageupload.php     

if ($_FILES['image_upload_file']["error"] > 0) {
    $output['error']= "Error in File";
}
elseif (!in_array($_FILES['image_upload_file']["type"], $allowedImageType)) {
$output['error']= "You can only upload JPG, PNG and GIF file";
}
elseif (round($_FILES['image_upload_file']["size"] / 1024) > 4096) {
$output['error']= "You can upload file size up to 4 MB";
} else {
    /*create directory with 777 permission if not exist - start*/
    createDir(IMAGE_SMALL_DIR);
    createDir(IMAGE_MEDIUM_DIR);
    /*create directory with 777 permission if not exist - end*/
    $path[0] = $_FILES['image_upload_file']['tmp_name'];
    $file = pathinfo($_FILES['image_upload_file']['name']);
    $fileType = $file["extension"];
    $desiredExt='jpg';
    $fileNameNew = rand(333, 999) . time() . ".$desiredExt";
    $path[1] = IMAGE_MEDIUM_DIR . $fileNameNew;
    $path[2] = IMAGE_SMALL_DIR . $fileNameNew;

if (createThumb($path[0], $path[1], $fileType, IMAGE_MEDIUM_SIZE, IMAGE_MEDIUM_SIZE,IMAGE_MEDIUM_SIZE)) {

if (createThumb($path[1], $path[2],"$desiredExt", IMAGE_SMALL_SIZE, IMAGE_SMALL_SIZE,IMAGE_SMALL_SIZE)) {
    $output['status']=TRUE;
    $output['image_medium']= $path[1];
    $output['image_small']= $path[2];
  }
 }
}
echo json_encode($output);
}
?>

settings.php

<script>
$(document).on('change', '#image_upload_file', function () {
var progressBar = $('.progressBar'), bar = $('.progressBar .bar'), percent = $('.progressBar .percent');
$('#image_upload_form').ajaxForm({
beforeSend: function() {
progressBar.fadeIn();
    var percentVal = '0%';
    bar.width(percentVal)
    percent.html(percentVal);
},
uploadProgress: function(event, position, total, percentComplete) {
    var percentVal = percentComplete + '%';
    bar.width(percentVal)
    percent.html(percentVal);
},
success: function(html, statusText, xhr, $form) {   
obj = $.parseJSON(html);  
if(obj.status){   
  var percentVal = '100%';
  bar.width(percentVal)
  percent.html(percentVal);
  $("#imgArea>img").prop('src',obj.image_medium);     
}else{
  alert(obj.error);
}
},
complete: function(xhr) {
progressBar.fadeOut();      
} 
}).submit();    
});
</script>

形式

 <form enctype="multipart/form-data" action="imageupload.php" method="post" name="image_upload_form" id="image_upload_form">
 <div id="imgArea"><img src="<?php echo $profile_photo; ?>">
 <div class="progressBar">
 <div class="bar"></div>
 <div class="percent">0%</div>
 </div>
 <div id="imgChange" style="background: url("../img/overlay.png") repeat scroll 0 0 rgba(0, 0, 0, 0);bottom: 0;color: #FFFFFF;display: block;height: 30px;left: 0;line-height: 32px;position: absolute;width: 100%;"><p>Click on photo to change</p>
  <input type="file" accept="image/*" name="image_upload_file" id="image_upload_file">
 </div>
 </div>
 </form>

0 个答案:

没有答案