jqueryで画像をアップロードして結果を表示

Question

これは典型的な質問ですが、私はたくさんのことを試してみましたが、まだうまく機能していません。私は画像をアップロードしたいフォームがあり、jqueryをネイティブに理解するようになったので、フォーム送信のimageuploadをサポートしています。だから私たちは私が持っているHTMLで始まる：

<form action="uploadImage.php" method="post" enctype="multipart/form-data" id="image_form" name="image_form">                           

<input type="file" name="addImage" />              

<input type="submit" name="submit" value="submit" />  

            </form> 
<div id="results"> 
</div> 

そして、我々はJavaScriptを持っている：

$(document).ready(function() { 

             $('#image_form').submit(function() { // catch the form's submit event 
              $.ajax({ // create an AJAX call... 
               data: $(this).serialize(), // get the form data 
               type: $(this).attr('method'), // GET or POST 
               url: $(this).attr('action'), // the file to call 
               success: function(response) { // on success.. 
                $('#results').load('Images.php'); // update the DIV 
               } 
              }); 
              return false; // cancel original event to prevent form submitting 
             }); 
             }); 

何かが、私はhttp://malsup.com/jquery/のimplentationを必要とするが、私は実際にどのように理解していないと言われます。そして、画像アップロードのための私のPHPスクリプトは正常に動作し、素晴らしいですので、私はちょうどフォームのアクションを使用することができますが、jqueryで提出することがクールだろう。

ベストセラー

Answer 1

ファイル入力をシリアル化することはできません。非同期に何かをアップロードしてすべてのブラウザで動作させるには、非表示のiframeトリックを使用する必要があります。私はそれのためのjQueryプラグインを見つけることをお勧めしたいと思います。 Here is one you can try.

Answer 2

uploadifyのようなプラグインを使用することをお勧めします。