数据表延迟加载不起作用

Question

我一直在尝试使用datatable的延迟加载功能，但是它一次加载了所有数据，我无法弄清楚是怎么回事。

 var dataTable = dataTable || {}; dataTable = (function(namespace) { var api = "https://jsonplaceholder.typicode.com/photos"; namespace.drawDataTable = function() { try { $('#table').DataTable({ "processing": true, "serverSide": true, "ajax": { "url": api, "dataSrc": "" }, "columns": [{ "mData": "thumbnailUrl" }, { "mData": "albumId" }, { "mData": "id" }, { "mData": "title" }, // { "mData": "url" } ], "scrollY": 200, "scroller": { loadingIndicator: true } }); } catch (e) { console.error(e.message); } } return namespace; }(dataTable = dataTable || {})); $(document).ready(function() { dataTable.drawDataTable() }) 

 <link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css"> <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script> <script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script> <table id="table"> <thead> <tr> <th>thumbnailUrl</th> <th>albumId</th> <th>id</th> <th>title</th> <!-- <th>url</th> --> </tr> </thead> </table> 

我已经尝试过这些问题。

• 在Jquery数据表1.10.10中延迟加载表行？
• 数据表：无法读取未定义的属性“长度”

Answer 1

为了大块加载数据，您需要编写服务器端脚本，最好使用DataTables发行版中提供的帮助程序类SSP（ ssp.class.php ）。 这样，数据将以块的形式返回并由前端DataTables插件使用。

您的链接https://jsonplaceholder.typicode.com/photos一次返回所有记录，并且DataTables前端插件无法提取其中的一部分，而仍然必须下载整个JSON文件。

请参阅服务器端处理，以获取有关为了使延迟加载正常工作需要返回哪些数据的更多详细信息。