Datatables:缺少页面元素（排序、搜索、下一步…）_Datatables

Datatables:缺少页面元素（排序、搜索、下一步…）

datatables

Datatables:缺少页面元素（排序、搜索、下一步…）,datatables,Datatables,我正在设置我的第一个DataTables页面，尽管该表显示并格式化，但大多数附加元素都丢失了（排序列、搜索、下一个/上一个…）。我已经检查了文档，遵循了教程，但仍然卡住了，我能找到的只是浏览器ś（Chrome）中的一个无法理解的错误我的HTML文件（从jinja模板获取数据）：测试数据表 $（文档）.ready（函数（）{ $（“#示例”）.DataTable（）； } ); {{{（'Prod Code'）}} {{{（'Description'）} {{{（'Units'）} {{{

我正在设置我的第一个DataTables页面，尽管该表显示并格式化，但大多数附加元素都丢失了（排序列、搜索、下一个/上一个…）。我已经检查了文档，遵循了教程，但仍然卡住了，我能找到的只是浏览器ś（Chrome）中的一个无法理解的错误

我的HTML文件（从jinja模板获取数据）：


测试数据表
$（文档）.ready（函数（）{
$（“#示例”）.DataTable（）；
} );
{{{（'Prod Code'）}}
{{{（'Description'）}
{{{（'Units'）}
{{{（'Category'）}
{products%}中每个_产品的百分比}
{{each_product.prod_code}
{{each_product.prod_desc}
{{each_product.prod_units}
{{each_product.prod_Category}
{%endfor%}

下面是浏览器中页面的屏幕截图。当我将鼠标悬停在这些行上时，它们会变成浅灰色

以下是浏览器控制台中错误的屏幕截图：

你知道我错过了什么吗

谢谢

标题行中有5个标题单元格，但正文行中只有4个标题单元格。这是不匹配的。我想你需要删除那个空标题。另请参见此处：-这与您在此处遇到的错误相同。嗨，Andrewjames，额外的问题。谢谢你的关注！

<head>
  <title>Test DataTable</title>
  <meta charset="utf-8">

  <script src="https://code.jquery.com/jquery-3.5.1.js"></script>

  <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.22/css/jquery.dataTables.css">
  <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.22/js/jquery.dataTables.js"></script>

  <script type="text/javascript">
  $(document).ready(function() {
    $('#example').DataTable();
    } );
  </script>

</head>

<table id="example" class="display" style="width:100%">
    <thead>
      <tr>
        <th>{{_('Prod Code')}}</></th> 
        <th>{{_('Description')}}</th>          
        <th>{{_('Units')}}</th>
        <th>{{_('Category')}}</th> 
        <th></th>
      </tr>
  </thead>
  <tbody>
      {% for each_product in products %}
      <tr>
        <td> {{ each_product.prod_code }} </a></td>
        <td> {{ each_product.prod_desc }} </td>
        <td> {{ each_product.prod_units }} </td> 
        <td> {{ each_product.prod_Category }} </td>    
      </tr>       
    {% endfor %}  
  </tbody>
</table>