hirokonaBlog

ググる→忘れそう→即時メモ 京都のWebデザイナーの備忘録

Ajax通信と画像のアップロード

FormData使わなあかんのですね。。知らんかった。

jQuery Ajaxでファイルを送りたい! – かもメモ

processData: falseとcontentType: falseがポイントの様です。

new FormData()する時にformを渡してやると
form.submit();した時と同じ様に
フォーム内のデータがnameとvalueのセットでそのまま送信されます。

JavaScript – 【jQuery】FormDataの中身をコンソールで確認したい(59822)|teratail
https://teratail.com/questions/59822

フォームからファイルを選択した際に、submitする前にプレビュー表示する方法(jQuery版) – Qiita
https://qiita.com/kon_yu/items/f98df7ac826e7c36cc6c

$(function(){
  //画像ファイルプレビュー表示
  $('form').on('change', 'input[type="file"]', function(e) {
    var file = e.target.files[0],
        reader = new FileReader(),
        $preview = $(".preview");
        t = this;

    // 画像ファイル以外の場合は何もしない
    if(file.type.indexOf("image") < 0){
      return false;
    }

    reader.onload = (function(file) {
      return function(e) {
        $preview.empty();
        $preview.append($('<img>').attr({
                  src: e.target.result,
                  width: "150px",
                   class: "preview",
                  title: file.name
              }));
      };
    })(file);

    reader.readAsDataURL(file);
  });
});

あとひさびさ
JavaScriptメールアドレスチェッカー: 小粋空間
http://www.koikikukan.com/archives/2014/09/18-003333.php


投稿日

カテゴリー:

投稿者:

タグ:

コメント

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください