Dynatable的实现

我试图学习一些jQuery和JavaScript，并有一个整洁的项目尝试。它涉及从JSON文件中提取数据并根据日期以表格形式显示它。我发现Dynatable似乎做我想做的，但我不断收到“意外的JSON输入结束”错误。我使用的语法与Dynatabe页面上给出的示例相同，但它不返回任何记录。任何帮助将不胜感激，因为我确信我错过了简单的事情。 JSON文件被命名为JSON-records.jsonDynatable的实现

[ 
 
    { 
 
    "band": "Weezer", 
 
    "song": "GA Scorcho" 
 
    }, 
 
    { 
 
    "band": "Chevelle", 
 
    "song": "Family System" 
 
    }, 
 
]

<html> 
 

 
<head> 
 

 
\t <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
 
\t <script src="./jspkg-archive/jquery.dynatable.js"></script> 
 
\t <script src="json-records.json"></script> 
 
\t <style src="./jspkg-archive/jquery.dynatable.css"></style> 
 
</head> 
 

 
<body> 
 
<table id="my-final-table"> 
 
    <thead> 
 
    <th>Band</th> 
 
    <th>Song</th> 
 
    </thead> 
 
    <tbody> 
 
    </tbody> 
 
</table> 
 

 
<script type="text/javascript"> 
 

 
$(document).ready(function(){ 
 
\t $('#my-final-table').dynatable(); 
 
}); 
 

 

 
var $records = $('#json-records'), 
 
    myRecords = JSON.parse($records.text()); 
 
$('#my-final-table').dynatable({ 
 
    dataset: { 
 
    records: myRecords 
 
    } 
 
}); 
 
</script> 
 

 

 
</body> 
 
</html>

来源

2016-08-18 user2843365

你有一个流浪 '' 在你的JSON文件

[ 
    { 
    "band": "Weezer", 
    "song": "GA Scorcho" 
    }, 
    { 
    "band": "Chevelle", 
    "song": "Family System" 
    }, <--- Here 
]

来源

2016-08-18 23:19:30 Pat

谢谢！我修复了这个错误，但它仍然不起作用。当我使用调试器，它似乎挂在这一行myRecords = JSON.parse（$ records.text（））; – user2843365

我正在浏览dynatable的文档，看看你在做他们的例子。你想看的例子是AJAX的例子。如果你已经有了这些数据，并且想要制作一张表格，那么就使用AJAX。如果你有一个表并想从中获取数据，那么使用JSON.parse（） – Pat

这很有道理！我会试试看。非常感谢！！ – user2843365

Dynatable的实现

回答

相关问题