JavaScript リファレンス

Tweet

FileReader.readAsDataURL()はファイルオブジェクトをData URIに変換するメソッドです。

new FileReader()で生成したFileReaderオブジェクトのメソッドで引数にはFileオブジェクトを指定します。

Data URIに変換されたファイルはimg要素のsrc属性などに指定することで画象として表示することができます。

var reader = new FileReader();
document.getElementById("file").onchange = function(e){
	reader.addEventListener('load', function(e) {
		document.getElementById("img").setAttribute("src",e.target.result);
	});
	reader.readAsDataURL( this.files[0] );
}

sample

FileReaderオブジェクトにloadイベントを指定しておくことでファイルの読み込みを感知することが可能です。

参考URL

File API - W3C

登録日 : 2013年11月14日 最終更新日 : 2013年12月10日

同じカテゴリー(File)のエントリー

• URL.revokeObjectURL()
• URL.createObjectURL()
• readAsDataURL()
• readAsText()
• FileReaderオブジェクト
• Fileオブジェクト
• FileList.length
• files
• File