javascript - 表内的 jQuery 数据表导致 mData 未定义

Question

在我的一个项目中，我正在使用数据表。这是我表中导致错误的一列结构:

<th>
    <table class="table table-bordered table-condesed">
        <thead>
            <tr>
                <th colspan="7" class="text-center">Day Run</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>M</td>
                <td>T</td>
                <td>W</td>
                <td>T</td>
                <td>F</td>
                <td>S</td>
                <td>S</td>
            </tr>
        </tbody>
    </table>
</th>

这也是相应的列:

<td>
    <table class="table table-bordered">
        <tbody>
            <tr>
                <td tabindex="0">N</td>
                <td>N</td>
                <td>N</td>
                <td>N</td>
                <td>N</td>
                <td>N</td>
                <td>Y</td>
            </tr>
        </tbody>
    </table>
</td>

我不知道为什么，但这会在初始化时引发错误。这是我面临的错误。

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

我看不出有什么不妥。知道为什么它不起作用吗？

这是现场演示 Demo

Answer 1

这是因为您正在使用 class 初始化 datatable，例如:

$('.table').dataTable({searching: false, paging: false, responsive: true});

并且两个表的列定义都不同，我认为这是问题所在。

做一件事，为两个表提供不同的 id 并使用这些 id 的 启动 datatable