使用Javascript将客户端CSV读入数组

我知道这看起来像一个重复的问题，但查找类似的主题使我仍然无能为力。我试图为角色扮演游戏构建一个在线角色表，其中角色状态在客户端计算机上保存为txt或csv文件。使用Javascript将客户端CSV读入数组

例如，客户可能有一个文件中保存标题为Grandulf.txt其中有该字符的所有相关统计数据的内容一行像这样：

Grandulf,1,5,staff

除了要长得多，其可能给我一个名字，角色的力量属性，角色的智慧属性，角色的武器等。

我希望客户端（访问我的小网站应用的用户）能够点击按钮上传任何特定的字符文件他们已经创建了它，然后将数据放入一个数组中，我可以在整个数组中使用它web ap。

我想我可以使用<input type="file" onchange="functionCSVtoArray();">来启动这个进程，但我不知道如何将它放到一个名为charStats的数组中，我稍后可以使用它。例如，我将为该名称设置一个等于charStats[0]的文本字段值，因为该名称始终是第一个，因此将数字字段值设置为charStats[1]，因为我将始终将该值作为数组中的第二个值，因此向前。

我已经（或将要）有一个html字符表，人们每次只能输入值，但我正在寻找一种快速简单的方法，让人们无需“保存”和“加载”他们的角色学习SQL，PHP或其他数据库首字母缩略词，这超出了我的能力和技能。

这可能吗？

编辑：我试过这个后，我问原来的问题，但我仍然不知道为什么它的作品。特别是，我不明白为什么函数中存在一个“e”作为参数。

loadCharacter.onchange = function(e) { 
    var reader = new FileReader(); 
    reader.onload = function(event) { 
     charStats.value = event.target.result; 
     statsArray = event.target.result; 
     statsArray = statsArray.split(","); 
     saveButton.disabled = false; 
    } 
    name = e.target.files[0].name; 
    reader.readAsText(new Blob([e.target.files[0]], { 
     "type": "text/plain" 
    })); 
    /* Need to take the statsArray and put everything in the appropriate fields on the character sheet */ 
}

来源

2017-07-30 ericbright2002

虽然我理解你是从你的评论来了，你恰巧在这种情况下不正确。我不是在寻找某人为我编码，而是为了了解它是如何工作的。我之前没有发布任何代码，因为之前的3个多小时都在查看我不明白的不同代码版本。我不知道下面发布的FileReader的想法，我仍然在学习它的工作原理。谢谢你看起来都一样。 – ericbright2002

您可以使用FileReader，FileReader.prototype.readAsText()

var charStats = []; 
var reader = new FileReader; 
reader.onload = function() { 
    charStats.push(reader.result); 
    // do stuff with `charStats` array here 
    // as handler of `load` event of `FileReader` 
    // returns results asynchronously 
} 

functionCSVtoArray() { 
    var file = document.querySelector("input[type=file]").files[0]; 
    reader.readAsText(file); 
};

来源

2017-07-30 20:12:59 guest271314

感谢您的回应！以上是我在此期间提出的，但看起来你有更好的解决方案。 – ericbright2002

@ ericbright2002没有必要将'File'传递给'Blob'构造函数，'File'对象继承自'Blob'对象 – guest271314

使用Javascript将客户端CSV读入数组

回答

相关问题