重複の可能性:
JQuery 内の AJAX を介したファイルのアップロード
フォームを送信せずにファイルを簡単にアップロードする方法 (jQuery + AJAX を使用)
フォームを使用してファイルをアップロードできることは知っていますenctype="multipart/form-data"
が、理解しようとしているのは、Jquery Ajaxを使用してファイルをアップロードすることです..
任意のヒント??前もって感謝します。
重複の可能性:
JQuery 内の AJAX を介したファイルのアップロード
フォームを送信せずにファイルを簡単にアップロードする方法 (jQuery + AJAX を使用)
フォームを使用してファイルをアップロードできることは知っていますenctype="multipart/form-data"
が、理解しようとしているのは、Jquery Ajaxを使用してファイルをアップロードすることです..
任意のヒント??前もって感謝します。
このjQueryプラグインを試してくださいhttp://valums.com/ajax-upload/
次に、このJavaScriptコードを使用します
var uploader = new qq.FileUploader({
// pass the element
element: $(selector)[0],
// path to server-side upload script
action: '/server/upload'
});
詳細については、ドキュメントを確認してください
FormData オブジェクトを使用する必要がありますが、これは新しいブラウザーでのみ機能します。
if (window.FormData) {
$('input[type=file]').change(function() {
var formdata = new FormData();
var file = this.files[0];
formdata.append("files[]", file);
$.ajax({
url: "upload.php",
type: "POST",
data: formdata,
processData: false,
contentType: false
});
});
}
詳細情報: https://developer.mozilla.org/en/XMLHttpRequest/FormData
HTML の例といくつかの追加機能を含む lib も参照できます: http://net.tutsplus.com/tutorials/javascript-ajax/uploading-files-with-ajax/
古いブラウザーをサポートするために、iframe を作成し、ファイル入力要素を iframe に複製して、そこにフォームを送信できます。この方法では、ページは更新されず、AJAX のようなものになります。
上記のプラグインはすべて便利ですが、プロセスの背後にあるロジックを知りたい場合は、次のようになります。
echo
)。過去にhttp://blueimp.github.com/jQuery-File-Upload/を使用したことがありますが、優れたデモとドキュメントが用意されています。
あなたのニーズに依存します。
単一ファイルの場合、 http: //valums.com/ajax-upload/で十分です
multiplaファイルのアップロード + 複数ファイルの選択には、flash や html5 などの他のテクノロジーが必要です。pluploadまたはUploadifyを確認できます。
plupload は、flash、html5、silvernight html4 のアップロード方法をサポートしています。複数ファイルの選択もサポート (html4 を除く)
uploadify は、複数のファイルを選択するためのフラッシュと html5 をサポートします