JQuery-csv 未解析所有值

Question

我正在使用 jquery.csv 解析 csv 文件并以 table 格式显示数据。

我的 csv 文件数据：test.csv

header1, header2, header3, header4
value1, value2, value3, value4
value1, value2, value3, value4.1,value4.2,value4.3
value1, value2, value3, value4

我的代码：index.html

    var data;

    $.ajax({

        type: "GET",

        url: "test.csv",

        dataType: "text",

        success: function(response) {

            data = $.csv.toObjects(reponse);

            // generating the table for user view
            generateTable(data);

        var html = generateTable(data);

        $('#result').html(html);

    }

});

function generateTable(data) {

    var html = '';

    if (typeof(data[0]) === 'undefined') {

        return null;

    }

    if (data[0].constructor === Object) {

        for (var row in data) {

            html += '<tr>\r\n';

            for (var item in data[row]) {

                html += '<td>' + item + ':' + data[row][item] + '</td>\r\n';

            }

            html += '</tr>\r\n';

        }

    }

    return html;

}

代码没有产生错误，它在 table 中显示我打印的是每个 header 的一个值，但我想知道我怎样才能得到每个 [=31] 的多个值=]？与 header4 一样，有多个值，我希望 header4 的单元格中包含所有值。或者，如果您能提出任何更好的解析此类数据的方法，我将不胜感激。谢谢！

JSFiddle

http://jsfiddle.net/xpvt214o/685678/

Answer 1

我检查了你的 fiddle 并做了一个 console.log 让我打印出你解析的 csv 对象。它打印的变量没有第 3 行的最后两项。您的问题是 csv 解析器删除了这些项目。我认为这是由于您不正确的 csv 造成的。

您应该像这样添加您的 csv 以使其正确解析：

header1, header2, header3, header4,header4.2,header4.3
value1, value2, value3, value4,,
value1, value2, value3, value4.1,value4.2,value4.3
value1, value2, value3, value4,,

我认为 csv-parser 在每一行上需要等量的元素。

我已经在您的 fiddle 中测试了这个 csv，它显示了所有元素，但为第二行和第四行添加了空的或未定义的元素。

Answer 2

所以……我明白你的问题了，呵呵。我们开始吧：

            function generateTable(lines) {
                if (typeof(lines) === 'undefined' || lines.length == 0) {
                    return '';
                }
                var header = lines[0].split(',');
                var html = '';
                for (var row in lines) {
                    if(row == 0) {
                        continue;
                    }
                    html += '<tr>\r\n';
                    var cols = lines[row].split(',');
                    for (var col in cols) {
                        var item = header[col] ? header[col] : header[header.length-1];
                        html += '<td>' + item + ':' + cols[col] + '</td>\r\n';
                    }
                    html += '</tr>\r\n';
                }
                return html;
            }
            $.ajax({
                type: "GET",
                url: "test.csv",
                dataType: "text",
                success: function(response) {
                    $('#result').html(generateTable($.csv.parsers.splitLines(response)));
                }
            });

您不能只使用默认解析器来做您想做的事。所以你应该用 $.csv.parsers.splitLines 帮助器创建你自己的解析器（你可以阅读 there）。因此，您可以对溢出案例的这些值做任何您想做的事情。在您的情况下，您想使用最后一个 "column header" 作为这些值的 header，对吗？这是在这条线上发生的：

var item = header[col] ? header[col] : header[header.length-1];

如果该列存在于 header 定义中，它将调用 header 名称。如果没有，它将调用最后的 header 名称。就这样了？

JQuery-csv 未解析所有值

JQuery-csv not parsing all values

jquery

html

jquery-csv