我正在努力在 Bootstrap 中创建一个 DataTable。我完全按照插件文档中提到的步骤进行操作,该文档可以在链接https://datatables.net/examples/styling/bootstrap4 中找到,但不起作用。表格显示无排序、搜索、分页。
请帮忙。我不知道我做错了什么。
谢谢你,安娜玛丽亚
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<title>DataTable</title>
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/dataTables.bootstrap4.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.css">
</head>
<body>
<div class="wrapper">
<div class="card">
<div class="card-body">
<h4 class="card-title">Table example</h4>
<h6 class="text-muted card-subtitle mb-2">Bootstrap datatable</h6>
<div class="table-responsive" style="width:100%">
<table class="table table-bordered table-striped" id="table" style="width:100%">
<thead>
<tr>
<th>Column 1</th>
<th>Column 2</th>
<th>Column 3</th>
<th>Column 4</th>
</tr>
</thead>
<tbody>
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
<td>Cell 3</td>
<td>Cell 4</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<script src="assets/js/custom.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap4.min.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
</body>
</html>
相关分类