Question

所以，我已经看到了类似的问题，但我还没有得到一个有效的答案。每天公司都要将文件FTP到我们的服务器。我们已经知道文件名以及它在服务器上的位置。我们的工作是获取数据并将其插入到HTML表中。插入数据很容易，它可以获取问题所在的数据。如果我可以将整个CSV文件（它只有4个值）作为字符串，我可以使用正则表达式来完成。

我尝试用AJAX创建XMLHTTPRequest，然后使用responseText将数据作为字符串。在那里没有运气之后，我尝试使用JQuery来获取它。这是我的代码，但我总是得到错误＆＃39;登录到控制台。我想也许它只是无法处理csv文件。此外，file.csv现在与index.aspx位于同一目录中，因此您在代码中看到的文件路径。我们不想缓存该文件，因为它每天都会更新。谢谢你的帮助。

注意：以下代码已更正。如果您遇到类似问题，此代码应该适合您。请务必仔细检查文件路径，不要使用＆＃39; dataType： type ＆＃39;在$ .ajax块中。</ p>

 // Wait for the DOM to be ready
        $(document).ready(function() {
            // Use JQuery promises to make AJAX XMLHttpRequest
            promise = $.ajax({
                type:"GET",
                url:"file.csv",
                cache:false
            });

            // Run script when file is ready
            promise.done(function(data){
                console.log(data);

                // Table IDs represented as an array
                var ids = ['date', 'fund', 'change', 'points'];

                // Update table
                for (var x = 0; x < ids.length; x++) {
                    document.getElementById(ids[x]).innerHTML = data[x];
                }
            });

            // Run script if request fails
            promise.fail(function() {
                console.log('A failure ocurred');
            });

        });

Answer 1

我能够通过更改dataType来实现它：“text”。

还包括解析csv文件的代码。

$(document).ready(function() {

    promise = $.ajax({
        type:"GET",
        dataType:"text",
        url:"file.csv",
        cache:false
    });

    promise.done(function(data){

        //Parse CSV File
        //split on new line
        var dataArr = data.split("\n");

        //for each line in array
        $.each(dataArr,function(){
            if (this != "") {

                //split files and create row
                var row = new String("");
                valArr = this.split(",");
                    row += "<tr>"

                $.each(valArr, function(){
                    row += "<td>" + this +"</td>"
                });     

                    row += "</tr>"

                    //Add row to table
                    $('tbody').append(row);

            }

        });

    });

    // Run script if request fails
    promise.fail(function() {
       console.log('A failure ocurred');
    });

});

HTML：

<table class="table table-hover">
    <thead>
        <tr>
            <th>Date</th>
            <th>Fund</th>
            <th>Change</th>
            <th>Points</th>
        </tr>
    </thead>
    <tbody>

    </tbody>
</table>

enter image description here

如何从CSV文件中提取数据并使用它填充HTML表格？

1 个答案: