Fatal编程技术网

Javascript CSVToTable不工作

javascript jquery html

Javascript CSVToTable不工作,javascript,jquery,html,html-table,import-from-csv,Javascript,Jquery,Html,Html Table,Import From Csv,我目前正在使用这个插件，但由于某些原因无法将我的CSV转换为html表。我遵循了提供的文档，但它只是停留在“加载CSV数据…”上，有人能帮我吗 <html> <head> <script src="jquery-2.1.1.min.js"></script> <script src="jquery.csvToTable.js"></script> <script&

我目前正在使用这个插件，但由于某些原因无法将我的CSV转换为html表。我遵循了提供的文档，但它只是停留在“加载CSV数据…”上，有人能帮我吗

<html>
    <head>
        <script src="jquery-2.1.1.min.js"></script>
        <script src="jquery.csvToTable.js"></script>
        <script>
        $(function() {
          $('#CSVTable').CSVToTable('data.csv');
        });
        </script>
    </head>
<body>
    <div id="CSVTable"></div>
</body>
</html>


$（函数（）{
$（'#CSVTable'）.CSVToTable（'data.csv'）；
});
这里有一个工作示例：、一个测试csv和一个测试模板

您也可以按照这个示例使用表分类器

下载文件夹后的代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>jQuery CSVToTable</title>

    <link rel="stylesheet" href="css/csvtable.css" type="text/css" />

    <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="js/jquery.csvToTable.js"></script>
    <script type="text/javascript" src="js/jquery.tablesorter.dev.js"></script>

    <script>
    $(function() {
        $.get('test.csv', function(data) {
            $('#CSVSource').html('<pre>' + data + '</pre>');
        });
        $('#CSVTable').CSVToTable('test.csv', { loadingImage: 'images/loading.gif', startLine: 0 });
        $.get('test.tsv', function(data) {
            $('#TSVSource').html('<pre>' + data + '</pre>');
        });
        $('#TSVTable').CSVToTable('test.tsv', { loadingText: 'Loading TSV Data...', loadingImage: 'images/loading.gif', startLine: 0, separator: "\t" });
        $('#CSVTable2').CSVToTable('test.csv', { loadingImage: 'images/loading.gif', startLine: 1, headers: ['Album Title', 'Artist Name', 'Price ($USD)'] }).bind("loadComplete",function() { 
            $('#CSVTable2').find('TABLE').tablesorter();
        });;
    });
    </script>
</head>
<body>

This is a test of the CSVToTable plugin.
<br><br>
Original CSV (comma separated values) source of <a href="test.csv">test.csv</a>:<br>
<div id="CSVSource" class="source">
</div>

<br><br>
CSV To Table:<br>
<div id="CSVTable">

</div>

<br><br>
Original TSV (tab separated values) source of <a href="test.tsv">test.tsv</a>:<br>
<div id="TSVSource" class="source">
</div>

<br><br>
TSV To Table:<br>
<div id="TSVTable">

</div>


<br><br>
CSV To Table - made sortable using <a target="_blank" href="http://tablesorter.com/">jQuery tablesorter:</a><br>
<div id="CSVTable2">

</div>


</body>
</html>


jQuery CSVToTable
$（函数（）{
$.get（'test.csv'，函数（数据）{
$（'#CSVSource'）.html（''+data+''）；
});
$（'#CSVTable'）.CSVToTable（'test.csv'，{loadingImage:'images/loading.gif'，startine:0}）；
$.get（'test.tsv'，函数（数据）{
$（'#TSVSource'）.html（''+data+''）；
});
$（'#TSVTable'）.CSVToTable（'test.tsv'，{loadingText:'loadingtsv Data…'，loadingImage:'images/Loading.gif'，startine:0，分隔符：“\t”}）；
$（'#CSVTable2'）.CSVToTable（'test.csv'，{loadingImage:'images/loading.gif'，startine:1，headers:['Album Title'，'Artist Name'，'Price（$USD）]}）.bind（“loadComplete”，function（）{
$（'#CSVTable2'）.find（'TABLE'）.tablesorter（）；
});;
});
这是对CSVToTable插件的测试。



原始CSV（逗号分隔值）来源：




CSV到表格：




原始TSV（制表符分隔值）来源：




TSV至表：




CSV到表格-使用
您可以使用自己的jQuery版本。

您的浏览器控制台中有错误吗？“无法加载XMLHttpRequestfile:///C:/Users/blah/Desktop/test/data.csv. 收到无效响应。因此不允许访问源代码“null”。“我相信这是因为它不在web服务器上，任何人都有可能为我提供csv web文档，请，我可以参考并用作示例它对我来说很好，但还有一个额外的功能要求，我们如何为数据创建href？Column1 Column2数据数据到类似以下内容：数据数据