我正在尝试在网站表单上实现数据表。我在这方面遇到了一些困难,所以我退后一步,尝试在一个非常基本的表上实现 DataTables。我使用的表格直接来自 http://www.datatables.net/usage/。然后我调用了我认为需要的文件,但我仍然无法让数据表在这个基本的表上工作。我缺少什么?这是“练习”代码:
<script type="text/javascript" charset="utf-8" src="/media/js/jquery.js"></script>
<script type="text/javascript" charset="utf-8" src="/media/js/jquery.dataTables.js"></script>
<!--<script type="text/javascript" charset="utf-8" src="/media/src/DataTables.js"></script>-->
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
$('#table').dataTable();
} );
</script>
<style type="text/css" title="currentStyle">
@import "/media/css/jquery.dataTables.css";
</style>
<title>Untitled Document</title>
</head>
<table id="table" class="display">
<thead>
<tr>
<th>Column 1</th>
<th>Column 2</th>
<th>etc</th>
</tr>
</thead>
<tbody>
<tr>
<td>Row 1 Data 1</td>
<td>Row 1 Data 2</td>
<td>etc</td>
</tr>
<tr>
<td>Row 2 Data 1</td>
<td>Row 2 Data 2</td>
<td>etc</td>
</tr>
</tbody>
</table>
<body>
</body>
</html>
谢谢!
js和css文件是否真正被加载?您可以使用 firefox 上的 firebug 或 webkit 浏览器中的开发工具进行调试。 (只需右键单击表格并选择“检查元素”)
此外,DataTables 可在 Microsoft Ajax CDN 上使用。与 j查询
相同您可以尝试使用外部链接看看是否有效。像这样:
<link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/css/jquery.dataTables.css"/>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.3.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/jquery.dataTables.min.js"></script>
另请注意,使用外部库是一个很好的做法。
先检查jQuery是否加载。然后检查dataTables资产是否工作。您可以使用警报功能进行检查 不要在内部样式表中使用 @import,而更喜欢使用
<link rel="stylesheet" type="text/css" href="filepath/style.css">
在我的博客中,您可以看到使用数据表的步骤和其他选项。
你必须在脚本中添加一个属性:“defer”。
<script src = "http://cdn.datatables.net/1.10.18/js/jquery.dataTables.min.js" defer ></script>
https://anythingwp.com/unleash-the-power-of-jquery-datatables/ 按照此网址,它将包含数据表代码