html側
//multipleと name tmpfile[] という配列にする事によって複数選択可能 //onchange はフォームに変化が起きた時に起こすイベントハンドラ(今回はcheckfile関数を指定) <input type="file" id="file_input" name="tmpfile[]" multiple="multiple" onchange=checkfile()> //ファイル名を表示する disabled でtype="text"でありながらブラウザから文字列を直接かけないようにする。 <input id="selectfile" type="text" name="selectFile" value="" size="100" disabled>
javascript側
function checkfile() { //getElementByIdで上記のhtmlのID id="file_input" から選択されたファイルの情報を読み込む。 var file_name = document.getElementById("file_input").files; //変数定義 var list = ""; //for文で入っているファイルの文だけファイル名を取得する for (var i=0; i<file_name.length; i++){ list += file_name[i].name + " ," } //list の文字列の末尾の一文字を削除する var result = list.substr(0, list.length-1); //document.getElementByIdで idを selectfile に指定してdocument.getElementById("selectfile").valueで中身を変数resultで指定する document.getElementById("selectfile").value = result; }