javascript - 我如何将文本文件附加到我的 contenteditable div 中？

Question

1. 仅处理 .txt 文件
2. 如果格式不正确，则格式化（如果可能，必须将 apple-tab-span 转换为 ）
3. 附加到我的 contenteditable div

我知道 2 号离这个问题还很远，请告诉我我将如何处理类似的问题。我已经完成了类似 IDE 的系统，我即将添加打开和保存功能。

$('#open').addEventListener('change', getTextFile, false);

function getTextFile (e) {
     var files = e.target.files;
     var file = files[0];           
     var reader = new FileReader();
     reader.onload = function() {
     console.log(this.result);            
     }
     reader.readAsText(file)
}

http://jsfiddle.net/3veCE/7/

Answer 1

试试这个工作演示

function readSingleFile(evt) {

var f = evt.target.files[0];
  console.log(f);
   if (!f) {
    alert("Failed to load file");
       return;
} 
if (f.name.indexOf('.txt') == -1) {
        alert(f.name + " is not a valid text file.");
         return;     
              }    

  var r = new FileReader();
  r.onload = function(e) { 
      var contents = e.target.result;
    alert( "Got the file.n" 
          +"name: " + f.name + "n"
          +"type: " + f.type + "n"
          +"size: " + f.size + " bytesn"
          + "contents: " + contents
    );
      document.getElementById('board').innerHTML = contents;
  }
  r.readAsText(f);
   }

 document.getElementById('fileinput').addEventListener('change', readSingleFile, false);