現在、ファイルを読み込みthumnailとして表示させるJavascriptを勉強しており
下記のコードにたどり着いたのですが、何点かわからない点があったため、ご教示をいただければと
投稿させていただきました。
(1)reader.onload
マニュアルを読むと、「コンテンツが読み込み完了し利用可能になると発火する load イベント時に実行されるイベントハンドラを含みます」とされておりますが、
要するにFileReaderオブジェクト(そのインスタンス)のonloadプロパティに関数を指定の関数を指定することでloadイベント時に本関数処理が実行されるということでしょうか?
また、HTMLの特定のタグにonload属性を指定することと同じことでしょうか?
(2)document.createElement('span')
上記によって生成された<span>は参考サイト通りにコーディングした場合、<input type="file"..>
の直下に生成されるのですが、特に位置を指定していないにもかかわらずなぜ、直下に生成されるのでしょうか?
(3)(f)
即時関数として末尾に()を付していると理解しているのですが、fがどこからやってきたのかが調べてもわかりません。このfは何を意味しており、なぜ必要なのかご教示頂けますでしょうか。
初心者な質問かと存じ、恐縮ではございますが、よろしくお願い申し上げます。
Javascript
1 2 3中略) 4var reader = new FileReader(); 5reader.onload = (function(theFile) {//(1) 6return function(e) { 7var span = document.createElement('span');//(2) 8span.innerHTML = ['<img class="thumbnail" src="', e.target.result, 9 '" title="', escape(theFile.name), '"/>'].join('') 10 document.getElementById('list').insertBefore(span, null); 11 }; 12 })(f);//(3) 13中略)
回答2件
あなたの回答
tips
プレビュー