Question

我正在尝试在页面启动时加载文本文件，但结果用于reader.readAsText（text.files [0]）;

的TypeMismatchError

function mm(){
    var text=document.getElementById("aspect");
    const reader=new FileReader();
    reader.onload= function(){
        //var lines = this.result.split('\n');
        console.log(reader.result);};
    reader.readAsText(text.files[0]);}
window.addEventListener("load",mm,false);    


<body>
    <input id="aspect" type="file" value="aspects.txt" style="display:none;" />
</body>

我希望打印文件内容，但收到错误消息

Answer 1

要在未选择文件的情况下调用mm，而不是在窗口加载时调用function mm(){ var text=document.getElementById("aspect"); const reader=new FileReader(); reader.onload= function(){ //var lines = this.result.split('\n'); console.log(reader.result);}; reader.readAsText(text.files[0]); } <body> <input id="aspect" type="file" value="aspects.txt" onchange="mm()" style="display:none;" /> </body>，请在文件输入上添加更改事件处理程序。

const puppeteer = require('puppeteer');


async function startDb() {
    const browser = await puppeteer.launch({
        headless:false,
        defaultViewport:null
    });
    const page = await browser.newPage();
    await page.goto("https://example.com");
    await page.waitFor(3000);
    await page.keyboard.press('Enter');
    console.log('Opened')
};


startDb();

Answer 2

我会像这样格式化（我以前用过）：

window.onload = function() {

    //Check File API support
    if (window.File && window.FileList && window.FileReader) {
        var filesInput = document.getElementById("aspect");

        filesInput.addEventListener("change", function(event) {

            var files = event.target.files; //FileList object

            var file = files[0];

                //Only plain text check
            if (!file.type.match('plain')) continue;

            var yourReader = new FileReader();

            yourReader.addEventListener("load", function(event) {

                var textFile = event.target;
                console.log(textFile.result);

            });

            //Read the text file
            yourReader.readAsText(file);

        });
    }
    else {
        console.log("Your browser does not support File API");
    }
}

Answer 3

您不能将value的{{1}}设置为URL或硬编码的文件名。您需要使用OS文件选择器选择它，为此，您需要单击。

当前，您正在将input[type=file]传递给undefined，因此出现错误：

FileReader.readAsText()

您想要的是处理的更改，或者在页面加载时检查是否已填充它（例如，在Firefox中刷新页面之后）：

new FileReader().readAsText(undefined);

function onpageload() {
  var text = document.getElementById("aspect");
  text.addEventListener('change', readFile);
  // if at page load we already have some file selected
  if (text.files.length) {
    readFile.call(text);
  }
  // we need a mean to click our input
  document.getElementById('button').addEventListener('click', function(evt) {
    text.click();
  });

}

function readFile(evt) {
  const text = this;
  console.log(text)
  const file = text.files[0];
  if(!file) return; // no file, no reader
  const reader = new FileReader();
  reader.onload = function() {
    console.log(reader.result);
  };
  reader.readAsText(text.files[0]);
}


window.addEventListener("load", onpageload, false);

尝试使用readAsText时发生TypeMismatchError

3 个答案: