Jquery Datatable插件不能在html表上工作

我想使用DataTable插件向我的html表添加功能。我遵循从datatables.net安装和初始化的步骤，但它没有添加任何功能到我的HTML页面。我想知道是否因为我的表格被格式化为插件不支持的方式。Jquery Datatable插件不能在html表上工作

<html> 
<head> 
<link href="https://cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css" rel="stylesheet" type="text/css" /> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 

<script src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script> 
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
    <script> 
     $(document).ready(function() { 
     $('#example').DataTable(); 
     } 
     ); 
    </script> 
</head> 
<body> 
<table id="example" class="display" cellspacing="0" width="100%"> 
     <thead> 
      <tr> 
       <th>Name</th> 
       <th>Position</th> 
       <th>Office</th> 
       <th>Age</th> 
       <th>Start date</th> 
       <th>Salary</th> 
      </tr> 
     </thead> 
     <tfoot> 
      <tr> 
       <th>Name</th> 
       <th>Position</th> 
       <th>Office</th> 
       <th>Age</th> 
       <th>Start date</th> 
       <th>Salary</th> 
      </tr> 
     </tfoot> 
     <tbody> 
      <tr> 
       <td>Tiger Nixon</td> 
       <td>System Architect</td> 
       <td>Edinburgh</td> 
       <td>61</td> 
       <td>2011/04/25</td> 
       <td>$320,800</td> 
      </tr> 
      <tr> 
       <td>Garrett Winters</td> 
       <td>Accountant</td> 
       <td>Tokyo</td> 
       <td>63</td> 
       <td>2011/07/25</td> 
       <td>$170,750</td> 
      </tr> 
      <tr> 
       <td>Michael Bruce</td> 
       <td>Javascript Developer</td> 
       <td>Singapore</td> 
       <td>29</td> 
       <td>2011/06/27</td> 
       <td>$183,000</td> 
      </tr> 
      <tr> 
       <td>Donna Snider</td> 
       <td>Customer Support</td> 
       <td>New York</td> 
       <td>27</td> 
       <td>2011/01/25</td> 
       <td>$112,000</td> 
      </tr> 
     </tbody> 
    </table> 
    </body> 
    </html>

来源

2016-12-30 Anto Alexander

你的问题是，你正在加载的dataTable.js 以前 jQuery的。（你可以在浏览器（通常的Web控制台看到了问题输入F12时）加载的jQuery之前会解决你的问题：

<!-- first jQuery --> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
<!-- then dataTables --> 
<link href="https://cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css" rel="stylesheet" type="text/css" /> 

<script src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script> 
    <script> 
     $(document).ready(function() { 
     $('#example').DataTable(); 
     } 
     ); 
    </script>

来源

2016-12-30 09:58:59 fredtantini

Jquery Datatable插件不能在html表上工作

回答

相关问题