Image upload ajax jquery

问题:

Im new to jQuery. I try to upload a jpg image file by using ajax method. But when I upload, it doesn't upload. Could anyone please help me to do this?

HTML

<form action="" method="POST" enctype="multipart/form-data">      <input type="file" name="image" id="image"/> </form> 

jQuery

$('#submit').click(function() {     var image=$('#image').val()          $.post("upload.php",{image:image},function(data)         {             alert(data);         });     }   }) 

PHP

<?php      $image=$_POST['image'];       $imagename=date("d-m-Y")."-".time()."jpg";      $target_path = "uploads/".$imagename;       if(move_uploaded_file($image, $target_path))       {           echo 'moved';      }      else      {           echo 'error';      } ?> 

回答1:

To upload file using ajax you must need to use FormData like below.

$("form").on('submit', (function(e) {     e.preventDefault;     var formData = new FormData(this);      $.ajax({         url : "upload.php",         type : "POST",          data : formData,         cache : false,         contentType : false,         processType : false,         success : function(data) {             alert(data);         }     }); })); 

And your PHP script should be like below.

<?php      $image=$_FILES['image'];      $image_tmp =$_FILES['image']['tmp_name'];       $imagename=date("d-m-Y")."-".time().".jpg";      $target_path = "uploads/".$imagename;       if(move_uploaded_file($image_tmp, $target_path))       {          echo 'moved';      }      else      {          echo 'error';      } ?> 

文章来源: Image upload ajax jquery