Input FileUpload files 属性

HTML DOM インプット ファイルアップロード オブジェクト

定義と使用法

files 属性はファイルアップロードボタンで選択された1つまたは複数のファイルを表す FileList オブジェクトを返します。

FileList オブジェクトを使用して、ファイルの名前、サイズ、内容を取得できます。

この属性は読み取り専用です。

例

ファイルアップロードボタンを使用して1つまたは複数のファイルを選択し、選択されたファイルの情報を表示します：

var x = document.getElementById("myFile");
var txt = "";
if ('files' in x) {
  if (x.files.length == 0) {
    txt = "ファイルを選択してください。";
  } else {
    for (var i = 0; i < x.files.length; i++) {
      txt += "<br><strong>" + (i+1) + ". ファイル</strong><br>";
      var file = x.files[i];
      if ('name' in file) {
        txt += "名前：" + file.name + "<br>";
      }
      if ('size' in file) {
        txt += "サイズ：" + file.size + "バイト <br>";
      }
    }
  }
} 
document.getElementById("demo").innerHTML = txt;

自分で試してみる

構文

fileuploadObject.files

技術的詳細

返り値： FileList オブジェクトは、選択されたファイルを表します。

ブラウザのサポート

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
サポート 10.0 サポート サポート サポート

HTML DOM インプット ファイルアップロード オブジェクト