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


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

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

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

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

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

回答の条件
  • 1人1回まで
  • 13歳以上
  • 登録:2016/07/06 18:09:08
  • 終了:2016/07/13 18:10:03

ベストアンサー

id:degucho No.1

degucho回答回数245ベストアンサー獲得回数622016/07/06 19:53:22

ポイント150pt

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

id:nagato-yuki

回答ありがとうございます。
また参考になるなるURLのご提示に感謝いたします。

また機会がございましたらよろしくお願い致します。

2016/07/14 00:02:03

その他の回答(1件)

id:degucho No.1

degucho回答回数245ベストアンサー獲得回数622016/07/06 19:53:22ここでベストアンサー

ポイント150pt

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

id:nagato-yuki

回答ありがとうございます。
また参考になるなるURLのご提示に感謝いたします。

また機会がございましたらよろしくお願い致します。

2016/07/14 00:02:03
id:victor_victor No.2

ビ=ヨンセ回答回数24ベストアンサー獲得回数42016/07/07 00:12:02

ポイント150pt

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
});
id:nagato-yuki

回答ありがとうございます。
また参考になるなるURLのご提示に感謝いたします。

また機会がございましたらよろしくお願い致します。

2016/07/14 00:02:10

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません