使用ajax，jquery，php上传文件

Question

我想上传文件并发送到服务器而不刷新页面。

我有以下线在我的HTML文件

<form id="FileUploader" enctype="multipart/form-data" > 
    <input type="file" name="mfile" id="mfile" style='width:100%;' onchange="uploaded()"> 
</form> 

function uploaded() 
    { 
     alert($('form#FileUploader')[0]); 
     var formData=new FormData($('form#FileUploader')[0]); 
     //alert(formData); 
      $.ajax({ 
      url: "<?php echo $_SESSION['webpage']."/upload" ?>", 
      type: "POST", 
      async: true, 
      dataType: "JSONP", 
      data : formData 
      }) 
      .success (function(response){ 
       alert(response); 
      }) 
      .error (function()  { alert("Error") ; }) ; 


    } 

upload.php的文件

if ($_FILES["mfile"]["error"] >0) 
    { 
     echo "Error: " ; 
    } 
    else 
    { 
     if (file_exists("upload_email_files/" . $_FILES["mfile"]["name"])) 
      { 
      echo $_POST["file"]. " already exists. "; 
      } 
     else 
      { 
      $otp= move_uploaded_file('$_FILES["mfile"]"name"]','/../upload_templates/'); 
      } 
    } 

它不工作。可有人帮我在这？ 它不是在upload.php中，并给我错误非法调用。

感谢， 希里什

Answer 1

在“没有清爽页面”的情况下，你可以使用隐藏的iframe 。

仅供参考，

http://viralpatel.net/blogs/ajax-style-file-uploading-using-hidden-iframe/，

http://joekuan.wordpress.com/2009/06/12/ajax-a-simplified-version-of-file-upload-form-using-iframe/

Answer 2

检查了这一点我没有测试它希望这将工作http://blog.new-bamboo.co.uk/2012/01/10/ridiculously-simple-ajax-uploads-with-formdata

<form id="FileUploader" enctype="multipart/form-data" > 
    <input type="file" name="mfile" id="mfile" style='width:100%;' onchange="uploaded()"> 
</form> 

function uploaded() 
    { 
     alert($('form#FileUploader')[0]); 
     var formData=new FormData($('form#FileUploader'));//remove [0] 
     //alert(formData); 
      $.ajax({ 
      url: "<?php echo $_SESSION['webpage']."/upload" ?>", 
      type: "POST", 
      //async: true,//Remove this line 
      //dataType: "JSONP",//Remove this line 
      data : formData 
      }) 
      .success (function(response){ 
       alert(response); 
      }) 
      .error (function()  { alert("Error") ; }) ; 


    } 

Answer 3

试试这个:)

<form id="FileUploader" enctype="multipart/form-data" > 
    <input type="file" name="mfile" id="mfile" style='width:100%;' onchange="uploaded()"> 
</form> 
$(document).ready(function() { 
$("#form-geninfo").submit(function(e) 
{ 
    e.preventDefault(); 
    alert($('form#FileUploader')[0]); 
    var formData=new FormData($('form#FileUploader')[0]); 
    //alert(formData); 
     $.ajax({ 
     url: "<?php echo $_SESSION['webpage']."/upload" ?>", 
     type: "POST", 
     async: true, 
     dataType: "JSONP", 
     data : formData 
     }) 
     .success (function(response){ 
      alert(response); 
     }) 
     .error (function()  { alert("Error") ; }) ; 


} 
});