JavaScript でのローカル ファイルの読み込み - HTML5 Rocks
Selecting and interacting with files on the user's local device is one of the most commonly used features of the web. It allows users to select files and upload them to a server, for example, when sharing photos or submitting tax documents. It also allows sites to read and manipulate them without ever having to transfer the data across the network. This page walks through how to use JavaScript to
JavaScript File APIを使ってアップロードフォームに画像プレビューを設置する
前回の続き。アップロードフォームで画像を選択すると、横に選択画像を表示するようにした。 成果物：upload.html (画像ファイルの選択でプレビューを表示) メモ ファイル選択ボタン(input type=”file”)のchangeイベントがトリガー ファイルオブジェクトはdocument.getElementById(“image”).files[0]で取得できるが、jQueryなら$(‘#image’).prop(‘files’)[0]と書ける $('#image').change(function() { var file = $(this).prop('files')[0]; var fr = new FileReader(); fr.onload = function() { $('#preview').attr('src', fr.result); // 読み込んだ画像デ
JavaScriptでファイル操作！？ File APIを使いこなそう
連載目次 近年のWebアプリケーションでは、画像ファイルやテキスト・ファイル、Officeファイルのアップロードやダウンロードのやり取りが行われることが多くなってきている（例えば、Twitter上での画像ファイル共有やGoogleドキュメントでのOfficeファイルのアップロードなどがそれだ）。 HTML5では、ファイル操作に関するAPIとして「File API」が定義されたことで、ローカルのファイルをブラウザ上で直接、取り扱うことが可能となった。これによって、Webとローカルの違いをアプリケーションで意識しなければならない局面も少なくなる。 現在、File APIは以下の3種類の仕様が策定されている。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
