Javascript DataTable插件，JSON解析期间出错
我正在用DataTable构建一个嵌套表 该表是从我从Ajax调用中获得的JSON字符串str构建的 str在JSON.parse之前：Javascript DataTable插件，JSON解析期间出错,javascript,jquery,json,datatables,Javascript,Jquery,Json,Datatables,我正在用DataTable构建一个嵌套表 该表是从我从Ajax调用中获得的JSON字符串str构建的 str在JSON.parse之前： "[ {\r\n \"ente\" : \"Roma\",\r\n \"cup\" : \"ABCDE3593CXXE\",\r\n \"decretoImpegno\" : \"decreto singolo\",\r\n \"dataDecretoImpegno\" : 61415276400000,\r\n \"importoImpegno\"
"[ {\r\n \"ente\" : \"Roma\",\r\n \"cup\" : \"ABCDE3593CXXE\",\r\n \"decretoImpegno\" : \"decreto singolo\",\r\n \"dataDecretoImpegno\" : 61415276400000,\r\n \"importoImpegno\" : 56000,\r\n \"finanziatoMiur\" : 343434,\r\n \"importoPagato\" : 55656,\r\n \"importoInPagamento\" : 9999,\r\n \"details\" : [ {\r\n \"progressivoPagamento\" : 22,\r\n \"dataDecreto\" : 61415276400000,\r\n \"numeroDecretoPagamento\" : \"numero dec pag\",\r\n \"tipoPagamento\" : \"tipo pag\",\r\n \"importoInPagamento\" : 45,\r\n \"notaDecreto\" : \"nota dec\"\r\n }, {\r\n \"progressivoPagamento\" : 22,\r\n \"dataDecreto\" : 61415276400000,\r\n \"numeroDecretoPagamento\" : \"numero dec pag\",\r\n \"tipoPagamento\" : \"tipo pag\",\r\n \"importoInPagamento\" : 45,\r\n \"notaDecreto\" : \"nota dec\"\r\n } ]\r\n}, {\r\n \"ente\" : \"Roma\",\r\n \"cup\" : \"ABCDE3593CXXE\",\r\n \"decretoImpegno\" : \"decreto singolo\",\r\n \"dataDecretoImpegno\" : 61415276400000,\r\n \"importoImpegno\" : 56000,\r\n \"finanziatoMiur\" : 343434,\r\n \"importoPagato\" : 55656,\r\n \"importoInPagamento\" : 9999,\r\n \"details\" : [ {\r\n \"progressivoPagamento\" : 22,\r\n \"dataDecreto\" : 61415276400000,\r\n \"numeroDecretoPagamento\" : \"numero dec pag\",\r\n \"tipoPagamento\" : \"tipo pag\",\r\n \"importoInPagamento\" : 45,\r\n \"notaDecreto\" : \"nota dec\"\r\n }, {\r\n \"progressivoPagamento\" : 22,\r\n \"dataDecreto\" : 61415276400000,\r\n \"numeroDecretoPagamento\" : \"numero dec pag\",\r\n \"tipoPagamento\" : \"tipo pag\",\r\n \"importoInPagamento\" : 45,\r\n \"notaDecreto\" : \"nota dec\"\r\n } ]\r\n} ]"
str=JSON.parse（str）var oTable = $('#exampleTable').dataTable({
"bJQueryUI": true,
"aaData": str,
...
console.log（str）显示它在我的web控制台中
（2） 我将console.log的结果复制到一个js变量中
var res = [ { //this JSON is exactly what I get from Ajax, the same I parsed..
"ente" : "Roma",
"cup" : "ABCDE3593CXXE",
"decretoImpegno" : "decreto singolo",
"dataDecretoImpegno" : 61415276400000,
"importoImpegno" : 56000,
"finanziatoMiur" : 343434,
"importoPagato" : 55656,
"importoInPagamento" : 9999,
"details" : [ {
"progressivoPagamento" : 22,
"dataDecreto" : 61415276400000,
"numeroDecretoPagamento" : "numero dec pag",
"tipoPagamento" : "tipo pag",
"importoInPagamento" : 45,
"notaDecreto" : "nota dec"
}],
"importoDaPagare" : 277779
}, {
"ente" : "Roma",
"cup" : "ABCDE3593CXXE",
"decretoImpegno" : "decreto singolo",
"dataDecretoImpegno" : 61415276400000,
"importoImpegno" : 56000,
"finanziatoMiur" : 343434,
"importoPagato" : 55656,
"importoInPagamento" : 9999,
"details" : [ {
"progressivoPagamento" : 22,
"dataDecreto" : 61415276400000,
"numeroDecretoPagamento" : "numero dec pag",
"tipoPagamento" : "tipo pag",
"importoInPagamento" : 45,
"notaDecreto" : "nota dec"
} ],
"importoDaPagare" : 277779
} ];
（3） 我将这个变量传递给DataTable（不解析它）并工作
var oTable = $('#exampleTable').dataTable({
"bJQueryUI": true,
"aaData": res,
...
这怎么可能
Datatable.js
detailsTableHtml = $("#detailsTable").html();
//Insert a 'details' column to the table
var nCloneTh = document.createElement('th');
var nCloneTd = document.createElement('td');
nCloneTd.innerHTML = '<img src="http://i.imgur.com/SD7Dz.png">';
nCloneTd.className = "center";
$('#exampleTable thead tr').each(function () {
this.insertBefore(nCloneTh, this.childNodes[0]);
});
$('#exampleTable tbody tr').each(function () {
this.insertBefore(nCloneTd.cloneNode(true), this.childNodes[0]);
});
//Initialse DataTables, with no sorting on the 'details' column
var oTable = $('#exampleTable').dataTable({
"bJQueryUI": true,
"aaData": res,
"bPaginate": true,
"aoColumns": [
{
"mDataProp": null,
"sClass": "control center",
"sDefaultContent": '<img src="http://i.imgur.com/SD7Dz.png">'
},
{ "mDataProp": "ente" },
{ "mDataProp": "cup" },
{ "mDataProp": "decretoImpegno" },
{ "mDataProp": "dataDecretoImpegno" },
{ "mDataProp": "importoImpegno" },
{ "mDataProp": "finanziatoMiur" },
{ "mDataProp": "importoPagato" },
{ "mDataProp": "importoInPagamento" }
],
"oLanguage": {
"sInfo": "_TOTAL_ entries"
},
"aaSorting": [[1, 'asc']]
});
/* Add event listener for opening and closing details
* Note that the indicator for showing which row is open is not controlled by DataTables,
* rather it is done here
*/
$('#exampleTable tbody td img').on('click', function () {
var nTr = $(this).parents('tr')[0];
var nTds = this;
if (oTable.fnIsOpen(nTr)) {
/* This row is already open - close it */
this.src = "http://i.imgur.com/SD7Dz.png";
oTable.fnClose(nTr);
}
else {
/* Open this row */
var rowIndex = oTable.fnGetPosition( $(nTds).closest('tr')[0] );
var detailsRowData = res[rowIndex].details;
this.src = "http://i.imgur.com/d4ICC.png";
oTable.fnOpen(nTr, fnFormatDetails(iTableCounter, detailsTableHtml), 'detail');
oInnerTable = $("#exampleTable_" + iTableCounter).dataTable({
"bJQueryUI": true,
"bFilter": true,
"aaData": detailsRowData,
"bSort" : true, // disables sorting
"aoColumns": [
{ "mDataProp": "progressivoPagamento" },
{ "mDataProp": "dataDecreto" },
{ "mDataProp": "numeroDecretoPagamento" },
{ "mDataProp": "tipoPagamento" },
{ "mDataProp": "importoInPagamento" },
{ "mDataProp": "notaDecreto" }
],
"bPaginate": true,
"oLanguage": {
"sInfo": "_TOTAL_ entries"
}/*,
"fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
var imgLink = aData['pic'];
var imgTag = '<img width="100px" src="' + imgLink + '"/>';
$('td:eq(0)', nRow).html(imgTag);
return nRow;
}*/
});
iTableCounter = iTableCounter + 1;
}
});
detailsTableHtml=$（“#detailsTable”）.html（）；
//在表中插入“详细信息”列
var nCloneTh=document.createElement（'th'）；
var nCloneTd=document.createElement（'td'）；
nCloneTd.innerHTML=''；
nCloneTd.className=“中心”；
$（'#示例thead tr'）。每个（函数（）{
this.insertBefore（nCloneTh，this.childNodes[0]）；
});
$（'#示例tbody tr'）。每个（函数（）{
this.insertBefore（nCloneTd.cloneNode（true），this.childNodes[0]）；
});
//初始化DataTables，在“详细信息”列上不排序
变量oTable=$（'#exampleTable'）。数据表({
“bJQueryUI”：没错，
“aaData”：res，
“bPaginate”：对，
“aoColumns”：[
{
“mDataProp”：空，
“sClass”：“控制中心”，
“内容”：”
},
{“mDataProp”：“ente”}，
{“mDataProp”：“cup”}，
{“mDataProp”：“DecretoImpigno”}，
{“mDataProp”：“DataDecretoImpigno”}，
{“mDataProp”：“importoImpegno”}，
{“mDataProp”：“finanziatoMiur”}，
{“mDataProp”：“importoPagato”}，
{“mDataProp”：“importoInPagamento”}
],
“语言”：{
“sInfo”：“总计项目”
},
“aaSorting”：[[1，‘asc']]
});
/*为打开和关闭详细信息添加事件侦听器
*请注意，用于显示打开的行的指示器不受DataTables控制，
*而是在这里完成的
*/
$（'#示例tbody td img'）。在（'click'，函数（）{
var nTr=$（this.parents（'tr'）[0]；
var nTds=此；
if（可旋转FNISOBEN（nTr））{
/*此行已打开-关闭它*/
this.src=”http://i.imgur.com/SD7Dz.png";
可旋转。关闭（nTr）；
}
否则{
/*打开这一排*/
var rowIndex=oTable.fnGetPosition（$（nTds）.closest（'tr'）[0]）；
var detailsRowData=res[rowIndex]。详细信息；
this.src=”http://i.imgur.com/d4ICC.png";
fnOpen（nTr，fnFormatDetails（itableccounter，detailsTableHtml），'detail'）；
OinerTable=$（“#exampleTable”+iTableCounter）。数据表({
“bJQueryUI”：没错，
“bFilter”：没错，
“aaData”：详细信息RowData，
“bSort”：true，//禁用排序
“aoColumns”：[
{“mDataProp”：“progressivoPagamento”}，
{“mDataProp”：“dataDecreto”}，
{“mDataProp”：“numeroDecretoPagamento”}，
{“mDataProp”：“tipoPagamento”}，
{“mDataProp”：“importoInPagamento”}，
{“mDataProp”：“notaDecreto”}
],
“bPaginate”：对，
“语言”：{
“sInfo”：“总计项目”
}/*,
“fnRowCallback”：函数（nRow、aData、iDisplayIndex、iDisplayIndexFull）{
var imgLink=aData['pic']；
var imgTag=“”；
$（'td:eq（0）”，nRow.html（imgTag）；
返回nRow；
}*/
});
iTableCounter=iTableCounter+1；
}
});
解决方案：我想在aJax调用中添加数据类型：“json”
。在初始化中是否使用列。数据选项？为了清晰起见，请显示完整的DataTables初始化代码。如果省略str=JSON.parse（str）
，是否有效？那么最有可能的str
已经是一个从JSON字符串转换而来的对象，不需要解析。只要在初始化代码中使用“aaData”：str
。@Gyrocode.com，我已经尝试过了，但它不起作用…str
变量的内容有问题，在调用JSON.parse
之前，您能准确输出console.log（str）
吗？您的代码工作正常，请参阅