Jquery Datatable：f 未在 jquery.dataTables.min.js 中定义答案

【问题标题】：Jquery Datatable : f is not defined in jquery.dataTables.min.jsJquery Datatable：f 未在 jquery.dataTables.min.js 中定义
【发布时间】：2017-12-30 11:15:54
【问题描述】：

我正在使用 Jquery 数据表。我得到 f is not defined 控制台错误。我没有在 Datatables 中使用 ajax 请求。

下面是我的表：

<table id="myTable"  class="table table-striped table-bordered dataTable"  >

    <thead>
      <tr>
         <th>Trip ID</th>
         <th>User Name</th>
         <th>From</th> 
         <th>To</th>
     </tr>
    </thead>
    <tbody>
     <tr><td>123231</td></tr>
     <tr><td>John</td></tr>
     <tr><td>dfshggsf</td></tr>
     <tr><td>dsfgfsgfsg</td></tr> 
   </tbody>
    <tfoot>
         <tr>
          <th>Trip ID</th>
          <th>User Name</th>
          <th>From</th> 
          <th>To</th>       
         </tr>
    </tfoot> 
        </table>    
</table>

下面是 Jquery 代码：

$(document).ready(function(){
      $('#myTable').DataTable({

          'ordering':false,
            dom: 'Bfrtip',

            buttons:[
                 {
                     extend: 'excelHtml5',
                     title: 'Data export'
                 },
                 {
                     extend: 'pdfHtml5',
                     title: 'Data export'
                 },
                  {
                     extend: 'csvHtml5',
                     title: 'Data export'
                 },
                  {
                     extend: 'print',
                     title: 'Data export'
                 } 
           ]
        });
    });

以下是控制台错误：

请帮我解决这个问题...任何帮助将不胜感激。

【问题讨论】：

你是如何导入 jQuery 数据表库的？
@yarwest 使用脚本标签，
能否提供整个控制台错误？
@yarwest TypeError: f is undefined [了解更多] jquery.dataTables.min.js:27:64
您是否尝试过将本地文件的导入替换为在线版本？ (cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js)

标签： javascript jquery datatables

【解决方案1】：

tbody 部分中的表结构不正确。

修正后的表结构如下所示。

<tbody>
   <tr>
      <td>123231</td>
      <td>John</td>
      <td>dfshggsf</td>
      <td>dsfgfsgfsg</td>
   </tr> 
</tbody>

有关代码和演示，请参阅this example。

【讨论】：

【解决方案2】：

是的 - 这就是 DataTables 告诉您表结构中存在不匹配的方式。最可能的解决方案是确保您的 <th> 行与您的 <td> 行匹配。

昨晚我发现 last_name 不是 DataTables 搜索框的一部分时遇到了这个问题。 DataTables 搜索列定义中提供的字段名称，而不是最终呈现的内容。因此，我将 last_name 列添加为可见：错误地认为它不需要标题。看到相同样式的错误信息，只好返回最后添加到标题行 = 问题已解决。

var columns = [

  { data: "first_name",
    render: function(data, type, row) {
      return row.first_name + " " + row.last_name;
    }
  },
  { data: "last_name",
    visible: false
  },
...
]

【讨论】：