javascript - 获取上传的文件/图像的名称

我有一个包含文件上传输入的表单

<form action="abc.php" method="post">
   <input name="fileToUpload" type="file" />
   <div id="view"></div>
   <button type="submit" value="submit" name="submit">Submit</button>
</form>

我希望获取单击此输入后上传的文件/图像的名称，并将其显示在<div id="view"></div>下，但这需要在提交表单之前完成。谁能告诉我该怎么做

最佳答案

试试这个代码，肯定会有所帮助

<input type="file" id="files" name="files[]" multiple />
<output id="list"></output>

脚本代码

function handleFileSelect(evt) {
        var files = evt.target.files; // FileList object

        // files is a FileList of File objects. List some properties.
        var output = [];
        for (var i = 0, f; f = files[i]; i++) {
          output.push('<li><strong>', escape(f.name), '</strong> (', f.type || 'n/a', ') - ',
                      f.size, ' bytes, last modified: ',
                      f.lastModifiedDate ? f.lastModifiedDate.toLocaleDateString() : 'n/a',
                      '</li>');
        }
        document.getElementById('list').innerHTML = '<ul>' + output.join('') + '</ul>';
      }

      document.getElementById('files').addEventListener('change', handleFileSelect, false);