Question

您好我需要帮助我如何使我的拖放读取dropzone中删除的.text文件..我仍在探索javascript并需要帮助指导我的代码有什么问题。。

文本文件的内容应显示在 displayarea

上

参考：http://blog.teamtreehouse.com/reading-files-using-the-html5-filereader-api

提前致谢！

[['5', '4', '3', '2', '1'], 
 ['6', '7', '8', '9'], 
 ['11', '12', '13', '14'], 
 ['15', '16', '17'], 
 ['18', '19', '20'], 
 ['21', '22', '23'], 
 ['24', '25', '26']]

Answer 1

您的代码应该是这样的。您必须删除onload事件侦听器。它在这里不兼容。

(function() {
  var dropzone = document.getElementById("dropzone");

  dropzone.ondrop = function(event) {
    event.preventDefault();
    this.className = "dropzone";

    console.log(event.dataTransfer.files[0]);


      var fileInput = document.getElementById('dropzone');
      var fileDisplayArea = document.getElementById('displayarea');

        var file = event.dataTransfer.files[0]
        var textType = /text.*/;

        if (file.type.match(textType)) {
          var reader = new FileReader();

          reader.onload = function(read) {
            fileDisplayArea.innerText = reader.result;
          }

          reader.readAsText(file);
          }

          else {
            fileDisplayArea.innerText = "File not supported!";
          }
}

  dropzone.ondragover = function() {
    this.className = "dropzone dragover";
    return false;
  };

  dropzone.ondragleave = function() {
    this.className = "dropzone";
    return false;
  };

}())

第一次使我拖放FileReader（）事件但无法读取文件的内容

1 个答案: