サムネイルを表示したい

質問

画像のアップロードで「参照」をクリックして画像を選ぶとサムネイルが表示されるものを作りたいです。

$(function($) {
$('input:file').change(function(){
$.ajax({
url: 'thumb.php',
data: {
name: "John"
},
}).done(function(data){
alert(data);
}).fail(function(data){
alert('error!!!');
}).always(function(){
// 通信終了
});
});
});

こんな風に書いてみました。
テキストはphpで受け取れましたが画像はセキュリティ上無理なのですね^^;

そこで調べてみるとこちらの方法があるようなのですが、
http://molaovo.hatenablog.jp/entry/20130111/1357913239

送信した時にではなく、changeイベントで動かすにはどうすればいいでしょうか？

画像は複数アップロードするので、1つずつ処理を行いたいです。

回答No.1

superside0 · ベストアンサー

もともと、Javascriptでは、ローカルのファイルにアクセスできなかったはずですが、
HTML5では、File APIでできるようになったらしいです。

これを使うと、ローカルの画像ファイルが選択された時点で（アップロードする前に）
サムネイル表示することもできるようです。

ご参考
http://www.html5rocks.com/ja/tutorials/file/dndfiles/