如何在JavaScript中更改输入type =“ file”名称

时间:2019-03-04 13:54:23

标签: javascript asp.net user-input

我在更改文件名时遇到问题。

我遇到的主要问题是用户从iPhone拍摄照片。 iOS将所有刚捕获的照片命名为image.jpg。我试图给用户一个机会来更改文件名或以编程方式执行某些操作,例如“ image(1).jpg”。

我正在寻找有关在JS中重命名文件的建议或关于如何防止用户上传具有相同名称的文件的其他想法。

function processSelectedFiles(fileInput) {
  var files = fileInput.files;
  var div = document.getElementById("fileList");

  for (var i = 0; i < files.length; i++) {
    var newFileName = prompt("Filename " + files[i].name,files[i].name);
    
    if (newFileName!== null){
      files[i].name=newFileName;
    }
    
    div.innerText += files[i].name;
  }
}
<!-- Learn about this code on MDN: https://developer.mozilla.org/en-US/docs/Web/API/File/name -->

<input type="file" multiple onchange="processSelectedFiles(this)">
</br>
File Name:
</br>
<div id="fileList"></div>

1 个答案:

答案 0 :(得分:0)

出于安全原因,浏览器中的javascript无法访问文件系统。 因此,如果您尝试从前端获取完整路径,则不可能 检查这里

https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_fileupload_value

您可以创建一个api并将其挂在前端,以进行任何文件名更改操作等。

Firefox(mozFullPath)提供了一些替代方法,但是目前还没有被广泛接受。