人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

jqueryを使用した画像のアップロードの仕方について

お世話になります。今回、jqueryのajaxの機能を利用して、画像のアップロードをしたいと思い質問をいたします。

jqueryのajaxを使用して、画像ファイル(jpeg)のアップロードをしたいと思っております。
アップロードをする際に、画像ファイルと一緒に同じform内のhiddenの値も一緒に送信したいと思っているのですが、そのコードの記述方法が分かりません。

http://music.geocities.jp/kinokolovers1/

上記URLの様なサンプルを作りまして、複数のフォームから画像ファイルとそのフォーム内のhiddenの値(上記URLでは「kakaku」と「hatsubaibi」)をjqueryのajaxで
送信したく思っております。
今回はソース内のスクリプトをどうすれば画像ファイルとhiddenの値を一緒に送信できるかお聞きしたく、送信先のphpプログラムは割愛させていただきたく思います。

どうぞよろしくお願い致します。


●質問者: nagato-yuki
●カテゴリ:ウェブ制作
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● degucho
●150ポイント ベストアンサー

自分の場合は下記リンクのやりかたでいけました。
http://chaika.hatenablog.com/entry/2014/04/12/001012


nagato-yukiさんのコメント
回答ありがとうございます。 また参考になるなるURLのご提示に感謝いたします。 また機会がございましたらよろしくお願い致します。

2 ● ビ=ヨンセ
●150ポイント

https://developer.mozilla.org/en-US/docs/Web/API/FormData/Using_FormData_Objects
Mozilla のサイトに $.ajax を使ってアップロードするソースのサンプルがありました。

var fd = new FormData(document.querySelector("form"));
fd.append("CustomField", "This is some extra data");
$.ajax({
 url: "stash.php",
 type: "POST",
 data: fd,
 processData: false, // tell jQuery not to process the data
 contentType: false // tell jQuery not to set contentType
});

nagato-yukiさんのコメント
回答ありがとうございます。 また参考になるなるURLのご提示に感謝いたします。 また機会がございましたらよろしくお願い致します。
関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ