2016-05-15 13 views
3

フォームデータに追加オブジェクトオブジェクトが空です。フォームデータオブジェクトは、追加呼び出し後も空を表示します

<!DOCTYPE html> 
<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 
<script> 
$(document).ready(function(){ 
    $("button").click(function(){ 
     var formy = new FormData(); 
     formy.append("file", $("#file")[0].files[0]); 
     console.log(formy); 
}); 
}); 
</script> 
</head> 
<body> 
<input id="file" type="file" size="40"><br><br> 
<button>Send an HTTP POST request to a page and get the result back</button> 

</body> 
</html> 

console.log($("#file")[0].files[0])が機能していないFORMDATAのために追加されたのはなぜ私が{name: "document.pdf", lastModified: 1462959300000, lastModifiedDate: Wed May 11 2016 15:05:00 GMT+0530 (IST), webkitRelativePath: "", size: 5275…}

ファイル与え、一方、コンソールログに上記のコードの出力は私に

Formdata{} 
append:function append() 
arguments:null 
caller:null 
length:2 
name:"append" 

を与えますか?

答えて

0

DOMファイルの属性に追加中にエラーが発生しているため、DOMのファイル属性を識別できず、呼び出し元がnull例外として認識されます。 また、FormData()は、初期化されるセレクタを返す必要があります。 ので、この

<!DOCTYPE html> 
    <html> 
    <head> 
     <script src="scripts/jquery-2.2.1.js"></script> 
     <script> 
    $(document).ready(function(){ 
     $("button").click(function(){ 
      //var formy = new FormData(); 
      //formy must return valid DOM selector and since our FormData code is unknown,I am using Div as example 
      //formy.append($('input[type="file"]'), $("#file")[0].files[0]); 
      $('#div1').append($('input[type="file"]'), $("#file1")[0].files[0]) 
//Now no null encountered 
// console.log($('div').append($('input[type="file"]'), $("#file1")[0].files[0])); 
    }); 
    }); 
     </script> 
    </head> 
    <body> 
     <input id="file1" type="file" size="40"><br><br> 
     <button>Send an HTTP POST request to a page and get the result back</button> 
     <div id="div1"></div> 
    </body> 
    </html> 

をお試しください:ファイルはjQueryの延長ではなく、CSSの仕様の一部であり、使用してクエリ:ファイルがネイティブDOM querySelectorAll()メソッドが提供するパフォーマンス向上の利点を取ることができません。最新のブラウザでパフォーマンスを向上させるには、代わりに[type = "file"]を使用します。 SRC:jQuery APIドキュメント

+0

これはあまり機能していません。私はまだFormdata {} –

+0

を取得する@KanikaMidhaあなたがまだ問題がある場合は私に教えてください。 :) –

2

実際にIS WORKINGを追加します。しかし、あなたはそのように記録することはできません。 があなたのコンテンツを表示するには、これを試してみてください。

<script> 
$(document).ready(function(){ 
    $("button").click(function(){ 
     var formy = new FormData(); 
     formy.append("file", $("#file")[0].files[0]); 

    for(var pair of formy.entries()) { 
     console.log(pair[0]+', '+pair[1]); 
    } 

}); 
}); 
</script> 

私は3つのコンソール文と同じコードのスクリーンショットを追加しました。 まずファイル[0]オブジェクトです。 2番目はペア[0] + '、' +ペア1です。 3つ目のフォームオブジェクトは、レポートしているときに空になります。

なぜこのようなことが起こるのでしょうか?ここでは理論を複製することはできません。

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

# I have provided description of console statements above

関連する問題