Question

您好我使用原生HTML5拖放将文件上传到服务器。我想获取从本地系统上传的文件的名称。我无法获取放置区域中丢弃的文件的名称。以下是我尝试过的代码。任何帮助将不胜感激

var reader = new FileReader();
    reader.onload = function (event) {
        var childrenDivs = document.getElementById("holder").children
        var temp    
        if(childrenDivs.length > 0){

            var lastDiv = childrenDivs[childrenDivs.length - 1]
            temp = parseInt(lastDiv.id.split("_")[1]) + 1
        }else{

            temp = 1
        }
      var imageDiv = document.createElement('div')
      imageDiv.id = "uploadedImage_"+temp
      var image = new Image();
      image.src = event.target.result;
      console.log(event.target.fileName)

而不是console.log(event.target.fileName)我还尝试了console.log(event.target.files[0].name)和console.log(event.dataTrasfer.files[0])。有人可以帮帮我吗。

Answer 1

你在哪里调用reader.readAs ...方法？

AFAIK，获取文件名的正确位置是注册dom元素的drop事件的位置。

element.ondrop = function(e) {
    e.preventDefault();

    var reader = new FileReader();
    reader.onload = function (event) {
        ....
    }

    var file = e.dataTransfer.files[0];
    // can get the name of the file with file.name
    console.log(file.name);
    reader.readAsBinaryString(file);

}

通过拖放FileReader获取文件名

1 个答案: