Javascript 完全不显示可移动分页
我正在努力显示可移动分页，但仍然无法理解它，即使我查看了文档和所有其他示例。在下面的代码中，两个表以不同的方式尝试，并且都不显示分页。有人能解释并指出在这段代码中显示分页需要什么吗？谢谢Javascript 完全不显示可移动分页,javascript,jquery,html,footable,Javascript,Jquery,Html,Footable,我正在努力显示可移动分页，但仍然无法理解它，即使我查看了文档和所有其他示例。在下面的代码中，两个表以不同的方式尝试，并且都不显示分页。有人能解释并指出在这段代码中显示分页需要什么吗？谢谢 <html lang="en"> <head> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-footable/3.1.6/footable.bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-footable/3.1.6/footable.core.bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-footable/3.1.6/footable.paging.css">
</head>
<body>
<table class="table footable table-striped" data-paging="true">
<thead>
<tr>
<th data-breakpoints = "xs">Col 1</th>
<th data-breakpoints = "xs">Col 2</th>
<th data-breakpoints = "xs">Col 3</th>
</tr>
</thead>
<tbody>
<tr>
<td>test1</td>
<td>test2</td>
<td>test3</td>
</tr>
<tr>
<td>test1</td>
<td>test2</td>
<td>test3</td>
</tr>
<tr>
<td>test1</td>
<td>test2</td>
<td>test3</td>
</tr>
<tr>
<td>test1</td>
<td>test2</td>
<td>test3</td>
</tr>
</tbody>
<tfoot>
</tfoot>
</table>
<table id="tblTesting" class="testingTable table table-striped" data-paging="true" data-page-navigation=".pagination" >
</table>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-footable/3.1.6/footable.js"></script>
<script src= "https://cdnjs.cloudflare.com/ajax/libs/jquery-footable/3.1.6/footable.paging.js"></script>
</body>
</html>
<script>
$(document).ready(function(){
$('.footable').footable();
$('#tblTesting').footable({
paging:{"enabled": true},
columns:[
{"name":"id","title":"ID","breakpoints":"xs sm","type":"number","style":{"width":80,"maxWidth":80}},
{"name":"firstName","title":"First Name"},
{"name":"lastName","title":"Last Name"},
{"name":"something","title":"Never seen but always around","visible":false,"filterable":false},
{"name":"jobTitle","title":"Job Title","breakpoints":"xs sm","style":{"maxWidth":200,"overflow":"hidden","textOverflow":"ellipsis","wordBreak":"keep-all","whiteSpace":"nowrap"}},
{"name":"started","title":"Started On","type":"date","breakpoints":"xs sm md","formatString":"MMM YYYY"},
{"name":"dob","title":"Date of Birth","type":"date","breakpoints":"xs sm md","formatString":"DD MMM YYYY"},
{"name":"status","title":"Status"}
],
"rows":[
{"id":1,"firstName":"Annemarie","lastName":"Bruening","something":1381105566987,"jobTitle":"Cloak Room Attendant","started":1367700388909,"dob":122365714987,"status":"Suspended"},
{"id":1,"firstName":"Annemarie","lastName":"Bruening","something":1381105566987,"jobTitle":"Cloak Room Attendant","started":1367700388909,"dob":122365714987,"status":"Suspended"},
{"id":1,"firstName":"Annemarie","lastName":"Bruening","something":1381105566987,"jobTitle":"Cloak Room Attendant","started":1367700388909,"dob":122365714987,"status":"Suspended"}
]
});
});
</script>
第1列
第2列
第3列
测试1
测试2
测试3
测试1
测试2
测试3
测试1
测试2
测试3
测试1
测试2
测试3
$（文档）.ready（函数（）{
$（'.footable'）.footable（）；
$（'tblTesting'）。可步行({
分页：{“已启用”：true}，
栏目：[
{“名称”：“id”，“标题”：“id”，“断点”：“xs sm”，“类型”：“编号”，“样式”：{“宽度”：80，“最大宽度”：80}，
{“名字”：“名字”，“头衔”：“名字”}，
{“姓名”：“姓氏”，“头衔”：“姓氏”}，
{“name”：“something”，“title”：“从未见过但总是在附近”，“visible”：false，“filterable”：false}，
{“name”：“jobTitle”，“title”：“Job title”，“breakpoints”：“xs sm”，“style”：{“maxWidth”：200，“overflow”：“hidden”，“textOverflow”：“ellipsis”，“wordBreak”：“keep all”，“whiteSpace”：“nowrap”}，
{“名称”：“开始”，“标题”：“开始日期”，“类型”：“日期”，“断点”：“xs sm md”，“格式字符串”：“MMM YYYY”}，
{“名称”：“dob”，“标题”：“出生日期”，“类型”：“日期”，“断点”：“xs sm md”，“格式字符串”：“DD MMM YYYY”}，
{“名称”：“状态”，“标题”：“状态”}
],
“行”：[
{“id”：1，“firstName”：“Annemarie”，“lastName”：“bruning”，“something”：1381105566987，“jobTitle”：“衣帽间服务员”，“started”：1367700388909，“dob”：122365714987，“status”：“Suspended”}，
{“id”：1，“firstName”：“Annemarie”，“lastName”：“bruning”，“something”：1381105566987，“jobTitle”：“衣帽间服务员”，“started”：1367700388909，“dob”：122365714987，“status”：“Suspended”}，
{“id”：1，“firstName”：“Annemarie”，“lastName”：“bruning”，“something”：1381105566987，“jobTitle”：“衣帽间服务员”，“started”：1367700388909，“dob”：122365714987，“status”：“Suspended”}
]
});
});