javascript - 未捕获的类型错误 : Cannot read property 'reload' of undefined

Question

我使用 Datatables 在 SpringBoot 应用程序的 Thymeleaf 模板上定义了 Datatable 的定义

<script th:inline="javascript">
/*<![CDATA[*/   

$(document).ready(function() {

    var table = $('#workerEventTable').dataTable( {
        order: [[ 0, "desc" ]],
        select: true,
        bLengthChange: false,
        stateSave: true,
        pageLength: 20,
        ajax: 'http://127.0.0.1:1234/acerinox/api/workerevent/datatableList',      
           "columns": [
               { data: 'id' },
               { data: 'deviceId' },
               { data: 'companyName' },
               { data: 'description' },
               { data: 'battery' },
               { data: 'dateTime' },
               { data: 'signal' },           
               { data: 'data' },
               { data: 'alarm' }
           ] 
    });

    setInterval( function () {
        table.ajax.reload( null, false ); // user paging is not reset on reload
    }, 1000 );


    table.on('select.dt deselect.dt', function() {
          localStorage.setItem( 'DataTables_selected', table.rows( { selected: true }).toArray() )   
    })

} );

/*]]>*/
</script>

但是存在一个 Javascript 问题:

Uncaught TypeError: Cannot read property 'reload' of undefined

这是我在模板中使用的所有导入:

<script th:src="@{/webjars/jquery/3.3.1/jquery.min.js}"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"    ></script>
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>

Answer 1

问题是 dataTable() 返回的是 jQuery 对象而不是 Datatables API。您将需要使用 DataTable() 来代替，注意大写 D。第一个 FAQ解释了这一点。