投稿者 tel | 2010年5月25日

ブラウザへのファイルのドロップ

File APIを使ったブラウザへのファイルのドラッグ&ドロップ処理のメモ。

$(document).ready(function() {
  $('#hoge').bind('drop', function(e) {
    e.preventDefault();
    loadFile(e.originalEvent.dataTransfer);
  });
  $('#hoge').bind('dragover', function(e) {
    e.preventDefault();
  });
});

jQueryを使用。ドロップされたファイルはe.originalEvent.dataTransfer.filesにファイルオブジェクトとして入ってるので適当な関数に渡してる。preventDefaultでイベントをキャンセルする理由は不明。

参考 https://developer.mozilla.org/En/DragDrop/DataTransfer


コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト / 変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト / 変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト / 変更 )

Google+ フォト

Google+ アカウントを使ってコメントしています。 ログアウト / 変更 )

%s と連携中

カテゴリー

%d人のブロガーが「いいね」をつけました。