我使用这个例子作为参考：https://datatables.net/extensions/responsive/examples/styling/bootstrap.html
但按钮没有显示出来 . 我已经尝试了很多数据表API的例子但是无法获得 - 按钮 .
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"
/>
<link rel="stylesheet"
href="https://cdn.datatables.net/1.10.16/css/dataTables.bootstrap.min.css"
/>
<link rel="stylesheet"
href="https://cdn.datatables.net/responsive/2.2.1/css/responsive.bootstrap.m
in.css" />
<meta name="description" content="Child Rows">
<title>ABC</title>
<style>
</style>
</head>
<body>
<div class="table-responsive">
<table id="example" class="table table-striped table-bordered dt-
responsive nowrap" cellspacing="0" width="60%" align=center>
<thead>
<tr>
<th>First name</th>
<th>Last name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Start date</th>
<th>Salary</th>
<th>Extn.</th>
<th>E-mail</th>
</tr>
</thead>
<tbody>
<tr>
<td>Tiger</td>
<td>Nixon</td>
<td>System Architect</td>
<td>Edinburgh</td>
<td>61</td>
<td>2011/04/25</td>
<td>$320,800</td>
<td>5421</td>
<td>t.nixon@datatables.net</td>
</tr>
<tr>
<td>Lael</td>
<td>Greer</td>
<td>Systems Administrator</td>
<td>London</td>
<td>21</td>
<td>2009/02/27</td>
<td>$103,500</td>
<td>6733</td>
<td>l.greer@datatables.net</td>
</tr>
<tr>
<td>Jonas</td>
<td>Alexander</td>
<td>Developer</td>
<td>San Francisco</td>
<td>30</td>
<td>2010/07/14</td>
<td>$86,500</td>
<td>8196</td>
<td>j.alexander@datatables.net</td>
</tr>
<tr>
<td>Shad</td>
<td>Decker</td>
<td>Regional Director</td>
<td>Edinburgh</td>
<td>51</td>
<td>2008/11/13</td>
<td>$183,000</td>
<td>6373</td>
<td>s.decker@datatables.net</td>
</tr>
<tr>
<td>Michael</td>
<td>Bruce</td>
<td>Javascript Developer</td>
<td>Singapore</td>
<td>29</td>
<td>2011/06/27</td>
<td>$183,000</td>
<td>5384</td>
<td>m.bruce@datatables.net</td>
</tr>
<tr>
<td>Donna</td>
<td>Snider</td>
<td>Customer Support</td>
<td>New York</td>
<td>27</td>
<td>2011/01/25</td>
<td>$112,000</td>
<td>4226</td>
<td>d.snider@datatables.net</td>
</tr>
</tbody>
</table>
</div>
</body>
<!-- /.modal -->
<script type="text/javascript" src="//code.jquery.com/jquery-1.12.4.js">
</script>
<script type="text/javascript"
src="//cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script type="text/javascript"
src="https://cdn.datatables.net/1.10.16/js/dataTables.bootstrap.min.js">
</script>
<script
src="https://cdn.datatables.net/responsive/2.2.1/js/dataTa
bles.responsive.min.js"></script>
<script type="text/javascript"
src="https://cdn.datatables.net/responsive/2.2.1/js/responsive.bootstrap.min
.js"></script>
<script>
$(document).ready(function() {
$('#example').DataTable();
} );
</script>
</html>
我已经为此示例包含了所有必需的Javascript库和css，但仍然存在相同的问题enter image description here
分页的所有其他功能工作正常，但无法显示子行的按钮 . 有人可以建议吗？
1 回答
检查下面，在其他js文件之前添加jquery，确保在表标记内添加
table-responsive类，确保使用外部文件正确的顺序，最后由于响应功能，加上按钮带有较小的显示 .