jQuery DataTables – 子行和“未定义不是函数”
我正在努力将子行添加到数据表中，并且对于在不同的表和页面上完美运行的代码行，我得到“TypeError：undefined不是函数”。 有任何想法吗？
HTML：
使用Javascript / jQuery的：
function format ( d ) { var html = ''+ ''+ 'Email Address: '+ ''+ d.email_address +' '+ 'Time Zone: '+ ''+ d.timezone +' '+ ' '+ ''+ 'Create Date: '+ ''+ d.create_date +' '+ 'Last Login: '+ ''+ d.last_login +' '+ ' '+ '
'; return html; } $(document).ready(function() { username = ""; userType = ""; var table = $('#users_table').dataTable({ order: [1, 'asc'], "ajax": { "url": "/s/user_data.php", "dataSrc" : "" }, "language": { "search": "Search: " }, "columns": [ {"data": null, "class": "details-control", "orderable": false, "defaultContent": "", "width": "2%"}, {"data": "username", "name": "username", "width": "20%"}, {"data": "fullName", "name": "fullName", "width": "20%"}, {"data": "type", "name": "type", "width": "15%"}, {"data": "cal_color", "name": "cal_color", "width": "15%"}, {"data": "create_date", "type": "date", "name": "create_date", "visible": false}, {"data": "time_zone", "name": "time_zone", "visible": false}, {"data": "last_login", "type": "date", "name": "last_login", "visible": false}, {"data": "email_address", "name": "email_address", "visible": false}, {"data": "uid", "name": "uid", "visible": false} ] }); // Add event listener for opening and closing details $('#users_table').find('tbody').on('click', 'td.details-control', function () { var tr = $(this).closest('tr'); var td = $(this).closest('td'); var row = table.row(tr); console.log(tr); console.log(td); console.log(row); if(row.child.isShown()) { // This row is already open - close it row.child.hide(); tr.removeClass('shown'); td.removeClass('shown'); } else { // Open this row row.child(format(row.data())).show(); tr.addClass('shown'); td.addClass('shown'); } }); });
生成错误的代码行如下。 它位于脚本底部三分之一的注释“添加事件监听器以打开和关闭详细信息”下。
var row = table.row(tr);
就像我说的，我在另一张桌子上使用相同的监听器，这条线路不是问题。 我已经多次检查了我的标点符号，并且没有看到任何丢失的逗号，分号或引号。 您可以看到我有3行写入控制台日志。 如果我注释掉有问题的行，这就是我得到的：
[tr.even, prevObject: n.fn.init[1], context: td.details-control, jquery: "1.11.0", constructor: function, selector: ""…] [td.details-control, prevObject: n.fn.init[1], context: td.details-control, jquery: "1.11.0", constructor: function, selector: ""…]
我不是一个强大的javascript或jQuery开发人员。 欢迎提出所有意见和建议。
谢谢。
我认为你应该更换
var table = $（’＃users_table’）。dataTable（{…
通过
var table = $（’＃users_table’）。DataTable（{
区别？ 具有大写“D”的数据。 否则，你不能使用函数table.row（）
从手册（ https://datatables.net/manual/api ）中，您可以看到：
重要的是要注意$（selector）.DataTable（）和$（selector）.dataTable（）之间的区别。 前者返回DataTables API实例，而后者返回jQueryJS对象。 api（）方法被添加到jQuery对象中，因此您可以轻松访问API，但jQuery对象可用于操作表节点，就像使用任何其他jQuery实例一样（例如使用addClass（）等。 ）。