在javascript中读取本地csv文件?

栏目: JavaScript · 发布时间: 7年前

内容简介:翻译自:https://stackoverflow.com/questions/29393064/reading-in-a-local-csv-file-in-javascript
[编辑]我用 D3

解决了这个问题,谢天谢地!

所以我有一个看起来像这样的csv文件,我需要将本地csv文件导入到我的客户端javascript:

"L.Name", "F.Name", "Gender", "School Type", "Subjects"
    "Doe",    "John",  "M",      "University",  "Chem I, statistics, English, Anatomy"
    "Tan",    "Betty",   "F",     "High School", "Algebra I, chem I, English 101"
    "Han",    "Anna",    "F",     "University",  "PHY 3, Calc 2, anatomy I, spanish 101"
    "Hawk",   "Alan",    "M",     "University",  "English 101, chem I"

我最终需要解析它并输出如下内容:

Chem I: 3         (number of people taking each subject)
Spanish 101: 1 
Philosophy 204: 0

但就目前而言,我只是坚持将其导入javascript.

我当前的代码如下所示:

<!DOCTYPE html>  
<html>  
<body>
<h1>Title!</h1>
<p>Please enter the subject(s) that you wish to search for:</p>
<input id="numb" type="text"/> 
<button onclick="myFunction()">Click me to see! :) </button>
<script>
function myFunction() {
    var splitResearchArea = []; 
    var textInput = document.getElementById('numb').value; 
    var splitTextInput = textInput.split(",");

  for(var i =0; i<splitTextInput.length; i++) {
    var spltResearchArea = splitTextInput[i];
    splitResearchArea.push(spltResearchArea);
  }
}

我已经研究过,并在Stackoverflow上找到了一些有用的链接,如 this , thisthis ,但我是javascript的新手,我并不完全理解它.我应该使用Ajax吗?的FileReader? jQuery的?使用一个优于另一个有什么好处?你将如何在代码中实现这一点?

但是,是的,我只是困惑,因为我对javascript很新,所以任何正确方向的帮助都会很棒.谢谢!!

以下是如何使用 FileReader

API中的readAsBinaryString()来加载本地文件.

<p>Select local CSV File:</p>
<input id="csv" type="file">

<output id="out">
    file contents will appear here
</output>

基本上,只需要在<input type =“file”>中收听改变事件.并调用readFile函数.

var fileInput = document.getElementById("csv"),

    readFile = function () {
        var reader = new FileReader();
        reader.onload = function () {
            document.getElementById('out').innerHTML = reader.result;
        };
        // start reading the file. When it is done, calls the onload event defined above.
        reader.readAsBinaryString(fileInput.files[0]);
    };

fileInput.addEventListener('change', readFile);

jsFiddle

翻译自:https://stackoverflow.com/questions/29393064/reading-in-a-local-csv-file-in-javascript


以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

重新定义团队:谷歌如何工作

重新定义团队:谷歌如何工作

拉兹洛·博克 / 宋伟 / 中信出版集团 / 2015-12-1 / CNY 56.00

谷歌首席人才官拉斯洛•博克权威力作,谷歌公开认可的谷歌高层作品,首度揭秘谷歌颠覆工业时代模式的人才和团队管理的核心法则,《纽约时报》畅销榜第一名,Business Insider 2015最佳商业书籍,谷歌的创造力就在于此! 编辑推荐! 1、 谷歌人才官首次公开谷歌人才和团队管理的核心秘籍 在谷歌执掌人事多年的拉斯洛•博克是人才和团队管理的顶级专家。他加入谷歌后,谷歌的员工数从六......一起来看看 《重新定义团队:谷歌如何工作》 这本书的介绍吧!

URL 编码/解码
URL 编码/解码

URL 编码/解码

SHA 加密
SHA 加密

SHA 加密工具

UNIX 时间戳转换
UNIX 时间戳转换

UNIX 时间戳转换