以前にも書いた通り，JavaScriptを活用したファイルアップロード例の第一弾ができたので，ここに追加予定の素材を手短にまとめておきます。
まずはDropzoneJSを使用した例を示します。jQueryの例は後ほど。
1. HTMLフォーム，PHPスクリプトだけでファイルアップロードができることを確認する。この例ではどちらも同じディレクトリ（フォルダ）に置いておく設定になっていることに注意。イメージファイルはその直下のimgディレクトリにコピーする。
HTMLフォーム
PHPスクリプト(upload_normal.php)
これでアップロードができないようなら，HTMLフォーム(nameなど)，PHPスクリプト，アップロード先のimgディレクトリの書き込み権限を確認すること。
2. DropzoneJSのソース(dropzone.js, dropzone.css)をダウンロードして適切なディレクトリに置いておく。ここではHTMLフォーム，PHPスクリプトと同じディレクトリに置いておく設定。
3. HTMLフォームのソースを下記のように書き換える。
ブラウザで開くと次のようにドロップエリア（四角の枠内）が表示されるので，ファイルをドラッグ＆ドロップしてみる。
下記のようになり，自動的にファイルがアップロードされたことを確認する。
4. DropzoneJSのオプションを利用して，次の機能
- メッセージの日本語化
- 自動アップロードの無効化とアップロードボタンの追加
- 画像ファイルのみアップロード可に。ファイル数は５個，一つ1MBに制限
- ファイル削除ボタンの追加
- アップロード後のファイル自動削除
を追加したHTMLフォームを用意する。ネタ元はこちら。
このフォームをブラウザで見ると，次のような画面になる。
なお，PHPスクリプト(upload_dropzone_option.php)はfileフォームの名前を”image_file”に変更しただけである。
画像ファイルをドラッグ＆ドロップしたらアップロードが開始され，終了したファイルから自動削除されることを確認すること。
