jqueryの$ .ajax関数をjsonとphpで使用してファイルをアップロードする方法

Question

jQueryの$.ajax関数を使用してファイルをアップロードしようとしていますが、出力が得られませんでした。 誰かがこれを解決するために私を助けてください。 このスクリプトが正しいかどうかわかりません。 私のスクリプトは次のとおりです。

$.ajax({ 
    url:'newsup.php', 
    data: "", 
    type: 'POST', 
    contentType:'multipart/form-data', 
    dataType: 'json', 
    catche: 'false', 

    success:function(data6) 
    { 
    $("#disp").removeClass().addClass((data6.error=== false)? 'success':'error').html(data6.msg).fadeIn('fast'); 
    //dele(); 
    if($("#disp").hasClass('success')) 
    { 
     alert("success"); 
     setTimeout("$('#disp').fadeOut('slow')",3000);    
    } 
    }, 

    error:function(XMLHttpRequest,textStatus,errorThrown) 
    { 
    $("#disp").removeClass().addClass('error').html("There was an <strong>"+errorThrown+"</strong> error due to <strong>"+textStatus+" condition").fadeIn('fast'); 
    }    

}); 

また、私はjQueryのを使用してファイルのアップロードフィールドからデータを取得助けが必要。

Answer 1

AJAXはファイルのアップロードをサポートしていません。基本的に隠しフォームを作成し、ファイルを動的にアップロードするプラグインはajaxfileuploadです。

は、このためのプラグインを使用してください見hereを取ると、オリの答え

Answer 2

をお読みください。
私の意見では、このプラグインはthis.Youのためのより良い解決策です。あなたは 'ajaxForm'にあなたの 'aj​​ax'を置き換えるなど、すべてのオプションetc.を覚えておく必要はありません。

http://jquery.malsup.com/form/#ajaxForm

Answer 3

の下に次の2つのプラグインJquery File Upload Plugins 1またはJquery File Upload Plugins 2のいずれかを使用することができますし、このスクリプトにエラーがありません、例をお読みください。

は、それが

おかげで、 ラシッド

Answer 4

は、単にファイルを送信し、デフォルトのフォームアクション

$('#form').submit(function(e) { return false; });

を防ぐために、フォーム上のイベントを提出し、サーバー上のファイルを取得する使用役に立てば幸い側経由で

$_FILES['inputName']; 

Answer 5

これが私のやり方です。 FormDataオブジェクトを使用します。

注：for文の奇妙な構文は、配列[i]に "f"を設定するだけです。

残念ながら、私はこれをどの記事から取得したのでしょうか？それはスタックオーバーフローの誰かでした。

Answer 6

AjaxはIE8/9 が、私はこれを使用していますし、それがうまく働いて

https://developer.mozilla.org/en-US/docs/Web/API/FormData

Answer 7

下記参照以外のすべての主要なブラウザでサポートしています。また、いるFormDataオブジェクトを使用して、ファイルのアップロードをサポートしています。

$('#btnUploadFile').on('click', function() { 
       var data = new FormData(); 
       var files = $("#fileUpload").get(0).files; 

       // Add the uploaded file content to the form data collection 
       if (files.length > 0) { 
        data.append("upload", files[0]); 
       } 

       // Make Ajax request with the contentType = false, and procesDate = false 
       var ajaxRequest = $.ajax({ 
        type: "POST", 
        url: "/api/documents", 
        contentType: false, 
        processData: false, 
        data: data, 

        error: function (xhr, status, error) { 
         console.log(xhr); 
         console.log(status); 
         console.log(error); 
         console.log(data); 
        } 
       }); 

       ajaxRequest.done(function (xhr, textStatus) { 
        $("#response").attr('class', "alert alert-success"); 
        $("#response").html("File uploaded successfully"); 
       }); 


      });