拜托，你能帮我在我的简单表上集成数据表 Bootstrap 吗？我添加了这段代码，但对我不起作用。
我也尝试将脚本链接添加到头部，但也没有用。我在这段代码中做错了什么？
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css" />
<link rel="stylesheet" href="jquery/dataTables.bootstrap.min.css" />
</head>
<body>
<div class="container">
<div class="jumbotron">
<h3>Požičovňa náradia SEAS</h3>
</div>
<script>
$(document).ready(function() {
$('#tabulka_kariet').DataTable();
});
</script>
<table id="tabulka_kariet" class="table table-bordered">
<thead>
<tr>
<th>Kód karty</th>
<th>Názov karty</th>
<th>Počet ks na všetkých skladoch</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Kód karty</th>
<th>Názov karty</th>
<th>Počet ks na všetkých skladoch</th>
</tr>
</tfoot>
<tr>
<td>13245</td>
<td>Sekacie kladivo Bosch 5184</td>
<td class="pocet">12</td>
</tr>
<tr>
<td>6789</td>
<td>Brúska Bosch 5184</td>
<td class="pocet">7</td>
</tr>
</table>
<?php
?>
</div>
</body>
<script src="bootstrap/js/bootstrap.min.js" />
<script src="jquery/jquery-3.0.0.min.js" />
<script src="jquery/dataTables.bootstrap.min.js" />
<script src="jquery/jquery.dataTables.min.js" />
<script src="jquery/jquery-1.12.4.js" />
</html>
最佳答案
您遇到了三个问题，一个是我没有注意到的，一个是我在提供帮助时发现的。
- 您在加载脚本之前调用了 jquery(我对帖子的评论是错误的)。在脚本加载后调用它，这就是人们告诉您将脚本添加到头部的原因。
- 您使用了两个版本的 jQuery。这不应该 完成，因为最终要加载的 jQuery 将是您使用的那个。如果您打算使用多个 jQuery 文件，请查看 no conflict between versions
- 你在 bootstrap 之后加载 jQuery，因为 bootstrap 使用 jQuery。 如果你想测试它，下面将运行。将脚本 url 更改为您本地的，它应该仍然可以运行。也将 css 链接更改为本地链接
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css" />
<link rel="stylesheet" href="jquery/dataTables.bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.15/css/jquery.dataTables.min.css"></link>
</head>
<body>
<div class="container">
<div class="jumbotron">
<h3>Požičovňa náradia SEAS</h3>
</div>
<table id="tabulka_kariet" class="table table-bordered">
<thead>
<tr>
<th>Kód karty</th>
<th>Názov karty</th>
<th>Počet ks na všetkých skladoch</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Kód karty</th>
<th>Názov karty</th>
<th>Počet ks na všetkých skladoch</th>
</tr>
</tfoot>
<tr>
<td>13245</td>
<td>Sekacie kladivo Bosch 5184</td>
<td class="pocet">12</td>
</tr>
<tr>
<td>6789</td>
<td>Brúska Bosch 5184</td>
<td class="pocet">7</td>
</tr>
</table>
<?php
?>
</div>
</body>
<!-- Jquery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!-- Datatables -->
<script src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script>
<!-- Bootstrap -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script>
$(document).ready(function() {
$('#tabulka_kariet').DataTable();
});
</script>
</html>关于javascript - DataTables Bootstrap 不工作，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44722666/