如何修复 colReorder 错误 - getAttribute 不是函数？

Question

我对 jQuery DataTable СolReorder 扩展有疑问。在控制台中出现错误，然后我拖动 header:

Uncaught TypeError: b.getAttribute is not a function

这是我的代码：

$(document).ready(function() {
$('#excel').DataTable( {
    stateSave: true,
    colReorder: {
        reorderCallback: function () {
            console.log( 'callback' );
        }
    }
} );
} );

<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://cdn.datatables.net/1.10.8/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/colreorder/1.2.0/js/dataTables.colReorder.min.js"></script>

<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.8/css/jquery.dataTables.min.css">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/colreorder/1.2.0/css/colreorder.dataTables.min.css">

<table id="excel" class="display" cellspacing="0" width="100%">
    <thead>
        <tr>
            <th>name</th>
            <th>number</th>
            <th>address</th>
            <th>city</th>
            <th>country</th>
            <th>lastname</th>
        </tr>
    </thead>
    <tfoot>
     <tr>
            <th>name</th>
            <th>number</th>
            <th>address</th>
            <th>city</th>
            <th>country</th>
            <th>lastname</th>
        </tr>
    </tfoot>

    <tbody>
        <tr>
            <td>Haroldas</td>
            <td>444</td>
            <td>address</td>
            <td>eee</td>
            <td>f</td>
            <td>r</td>
        </tr>
        <tr>
            <td>Tom</td>
            <td>999</td>
            <td>rrr</td>
            <td>tttt</td>
            <td>3</td>
            <td>r</td>
        </tr>
        <tr>
            <td>Ted</td>
            <td>333</td>
            <td>kkk</td>
            <td>null</td>
            <td>4</td>
            <td>r</td>
        </tr>
    </tbody>
</table>

Answer 1

CAUSE

DataTables 1.10.8 存在问题 #623，导致控制台出现以下错误：TypeError：row.getAttribute 不是 jquery.dataTables.js 处的函数.

SOLUTION

使用 DataTables 1.10.9 而不是 1.10.8。

DEMO

$(document).ready(function() {
$('#excel').DataTable( {
    stateSave: true,
    colReorder: {
        reorderCallback: function () {
            console.log( 'callback' );
        }
    }
} );
} );

<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/colreorder/1.2.0/js/dataTables.colReorder.min.js"></script>

<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.9/css/jquery.dataTables.min.css">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/colreorder/1.2.0/css/colreorder.dataTables.min.css">

<table id="excel" class="display" cellspacing="0" width="100%">
    <thead>
        <tr>
            <th>name</th>
            <th>number</th>
            <th>address</th>
            <th>city</th>
            <th>country</th>
            <th>lastname</th>
        </tr>
    </thead>
    <tfoot>
     <tr>
            <th>name</th>
            <th>number</th>
            <th>address</th>
            <th>city</th>
            <th>country</th>
            <th>lastname</th>
        </tr>
    </tfoot>

    <tbody>
        <tr>
            <td>Haroldas</td>
            <td>444</td>
            <td>address</td>
            <td>eee</td>
            <td>f</td>
            <td>r</td>
        </tr>
        <tr>
            <td>Tom</td>
            <td>999</td>
            <td>rrr</td>
            <td>tttt</td>
            <td>3</td>
            <td>r</td>
        </tr>
        <tr>
            <td>Ted</td>
            <td>333</td>
            <td>kkk</td>
            <td>null</td>
            <td>4</td>
            <td>r</td>
        </tr>
    </tbody>
</table>

如何修复 colReorder 错误 - getAttribute 不是函数？

How to fix colReorder error - getAttribute is not a function?

html

javascript

jquery

datatables