dataTable 给出 Uncaught TypeError: Cannot read property 'mData' of undefined答案

【问题标题】：dataTable gives Uncaught TypeError: Cannot read property 'mData' of undefineddataTable 给出 Uncaught TypeError: Cannot read property 'mData' of undefined
【发布时间】：2017-10-16 05:16:54
【问题描述】：

我正在尝试使用 jQuery Datatable 插件在 HTML 页面中进行分页。

<!DOCTYPE html>
<html>
<head> 
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script type="text/javascript"  src=" https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script type="text/javascript"  src=" https://cdn.datatables.net/buttons/1.2.4/js/dataTables.buttons.min.js"></script>

<meta charset="UTF-8">
<title>Clients</title>
</head>
<body>
<table style="width:100%" id="clients_data">
<caption>Clients</caption>
  <tr>
    <th>Clients</th>
    <th>Number of Sites</th> 
    <th>Reset the Processing</th> 
  </tr>
  </table>

<table style="width:100%" id="machines_data">
<caption>Machines</caption>
  <tr>
   <th>Number</th>
    <th>Machine Name</th>
  </tr>
  </table>

$(document).ready(function() {
     loadCustomers();
     loadMachines();
    $('#clients_data').DataTable( {
        "pagingType": "full_numbers"
    } );
    $('#machines_data').DataTable( {
        "pagingType": "full_numbers"
    } );

} );


function loadCustomers() {
    $.ajax({
        type: 'GET',
        url: 'http://localhost:8080/cache/getCustomers',
        dataType: 'json',
        success: function(data) {
            var rows = [];    
            $.each(data,function(id,value) {
                      rows.push('<tr><td><a href="clientSiteInfo.html?client='+id+'">'+id+'</td><td>'+value+'</td><td><button type="button" onclick="reset(\''+id+'\')">Reset</td></tr>');
                    });
            $('#clients_data').append(rows.join(''));
        }
    });
};

function loadMachines() {
    $.ajax({
        type: 'GET',
        url: 'http://localhost:8080/cache/getMachines',
        dataType: 'json',
        success: function(data) {
             var rows = [];    
             $.each(data,function(id,value) {
                      rows.push('<tr><td>'+id+'</td><td><a href="machineInfo.html?machine='+value+'">'+value+'</td></tr>');
                    });
             $('#machines_data').append(rows.join(''));

        }
    });
};
</script>
</body>
</html>

对于上述情况，当我尝试加载页面时，我得到：

Uncaught TypeError: Cannot read property 'mData' of undefined at $('#clients_data').DataTable({...})

我的脚本有什么问题？我正在关注this guide。

我的小提琴： https://jsfiddle.net/yeu7f3f2/

【问题讨论】：

我的建议是，请在 ajax 加载后使用 DataTable，它是异步请求，并且您的 rows.push 没有完成，然后您尝试设置数据表。
@FerhatBAŞ ，我应该如何订购这个？文档准备好我先尝试调用ajax函数..错了吗？
Uncaught TypeError: Cannot read property 'mData' of undefined 通常表示标头数和数据列数不匹配。
您好，您的问题出在 html 表格中，请添加如下所示的 thead 和 tbody Clients 站点数重置处理 dsds dsds dsds
我认为它是DataTable所必需的，我认为它无法找到哪个DOM元素DATA或HEADER因此无法做到