ドラッグ&ドロップでファイルアップロードする | バシャログ。こんにちは山崎です。久しぶりの投稿になります。 今回はJavascriptでドラッグアンドドロップでのファイルアップロードを実装しようと思います。 完成形・仕様 このような画面になります。ファイルはドラッグ＆ドロップもしくは、ファイル選択フィールドからアップロードし、下にアップロードされた画像を表示する形です。 Ajaxなどを使ってアップロードされた時点でサーバーに保存するのではなく、送信ボタンが押された時点でサーバーに画像がアップロードされる仕様です。 今回はスタイルを最低限しか当ててないため質素ですが、こういったUIはCMSの管理画面などでよく見ると思います。 実装 まずHTMLを作っていきます。今回は最低限のスタイルで済ませるので、インラインでスタイルを書いています。 <html lang="ja"> <head> <meta charset="UTF-8"> <title>ドラッグ
