未捕获的类型错误：无法读取未定义 #2 的属性“mData”

【问题标题】：Uncaught TypeError: Cannot read property 'mData' of undefined #2未捕获的类型错误：无法读取未定义 #2 的属性“mData”
【发布时间】：2017-10-25 09:41:55
【问题描述】：

我主要使用 jQuery 和 DataTables 制作表格

我在调用$('#dataTable').dataTable(); 时遇到错误，但我不明白为什么会发生这种情况，因为I see my table correctly displayed 但是 DataTable 脚本不起作用，所以表格保持正常，而不是分页等。 ..

这是错误：

jquery.dataTables.js:1197 Uncaught TypeError: Cannot read property
'mData' of undefined
 at HTMLTableCellElement.<anonymous> (jquery.dataTables.js:1197)
 at Function.each (jquery-1.9.1.js:648)
 at init.each (jquery-1.9.1.js:270)
 at HTMLTableElement.<anonymous> (jquery.dataTables.js:1194)
 at Function.each (jquery-1.9.1.js:648)
 at init.each (jquery-1.9.1.js:270)
 at init.DataTable [as dataTable] (jquery.dataTables.js:869)
 at DisplayTable (accounts.js:19)
 at TypesChanged (accounts.js:168)
    at HTMLDocument.<anonymous> (accounts.js:171)

HTML：

<div class="table-responsive">
    <table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
        <thead class="dataTableHead">
        <tr>
            <%--JSON ARRAY CREATES THE TABLE--%>
        </tr>
        </thead>
        <tfoot class="dataTableFooter">
        <tr>
            <%--JSON ARRAY CREATES THE TABLE--%>
        </tr>
        </tfoot>
        <tbody class="dataTableBody">
        <%--JSON ARRAY CREATES THE TABLE--%>
        </tbody>
    </table>
</div>

JavaScript

 var types = [];
    var amountOfDayEnds = parseInt($('#amountOfDayEnds').val());


        function TypesChanged() {
        selectedGroup = $('#group').val();
        switch (selectedGroup) {
            case "DDA":
                types = ["400","4044","4045"];
                break;
            case "SAV":
                types = ["300","310"];
                break;
            case "MTG":
                types = ["700","710"];
                break;
        }
        console.log("Selected group: " + selectedGroup + ", Types: " + types);
        $('.dataTableHead').empty();
        $('.dataTableFooter').empty();
        $('.dataTableHead').append('<th class="text-center">Day</th>');
        $('.dataTableFooter').append('<th class="text-center">Day</th>');
        var columnNames = [];
        $.each(types, function (index, value) {
            columnNames += '<th class="text-center">Type ' + value + '</th>';
        });
        $('.dataTableHead').append(columnNames);
        $('.dataTableFooter').append(columnNames);
        DisplayTable();
    }

    TypesChanged();

    function DisplayTable() {
        var data;
        //Table
        $('.dataTableBody').empty();
        for(var i=1;i<=amountOfDayEnds;i++) {
            data += '<tr align="center">';
            data += '<td>' + i + '</td>';
            $.each(types, function (index, value) {
                data += '<td>' + '<input class="text-center amountOfAccounts" type="number" value="0" name="amountOfAccounts-' + value + '"  data-error="Please, insert a value"  required></td>'
            });
            data += '</tr>';
        }
        $('.dataTableBody').append(data);

        $('#dataTable').dataTable();
    }

【问题讨论】：

• 这个错误似乎来自accounts.js:-> TypesChanged 函数。这个函数是做什么的？
• 通常当 元素的数量与表格的 或 或 元素不匹配时会发生此错误。确保生成这些 td 的函数都对齐以产生相同数量的 td
• 尝试将$('#dataTable').dataTable();更改为$('#dataTable').DataTable();
• @mmushtaq 没用
• @MaVRoSCy 错误出现在 $('#dataTable').dataTable(); 上，它显示在 TypesChanged() 上，因为它是从那里调用的