上传前在 html 输入中显示所选文件

Display selected file in html input before upload

如何将我 select 通过浏览字段输入 html 的文件显示出来?我想查看我在按上传之前 select 编辑的文件?

这是我的代码:

          <input id="uploadFile" name="uploadFileOne" type="text" disabled="disabled" value="<?php echo $file_name; ?>" placeholder="EWIS" class="name-info-form file-witdth" />              
          <input class="upload" type="file" id="uploadOne" name="uploadOne" value="Select File"/ >
<form>
  <input class="upload" type="file" id="uploadOne" name="uploadOne" onchange="setfilename(this.value);" value="Select File"/ >
  <input id="uploadFile" name="uploadFileOne" type="text" disabled="disabled" placeholder="EWIS" class="name-info-form file-witdth" />
</form>

删除 value=<?php echo $file_name; ?> 并使用 javascript 在文本框中设置文件名

<script>
  function setfilename(val)
  {
    var fileName = val.substr(val.lastIndexOf("\")+1, val.length);
    document.getElementById("uploadFile").value = fileName;
  }
</script>

当您 select 使用浏览按钮查看文件时,onchange 事件将触发并在 text-box 中设置文件名 :)