jquery DataTables表格插件的使用(网页数据表格化及分页显示)

浏览数：45 / 时间：2015年06月09日

DataTables - 非常强大的 jQuery 表格插件，可变宽页码浏览，现场过滤。

多列排序，自动探测数据类型，智能列宽，可从几乎任何数据源获取数据。

技术分享

那么在Bootstrap下如何使用DataTables：

只需要在html或ejs下引用写好的样式表css和脚本文件js，对应代码如下：

 1 <head>
 2     <link href="http://apps.bdimg.com/libs/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
 3     <script src="http://apps.bdimg.com/libs/jquery/2.0.0/jquery.min.js"></script>
 4     <script src="http://apps.bdimg.com/libs/bootstrap/3.0.3/js/bootstrap.min.js"></script>
 5     <link rel="stylesheet" href="http://cdn.datatables.net/1.10.4/css/jquery.dataTables.css"></style>
 6     <script src="http://cdn.datatables.net/1.10.4/js/jquery.dataTables.js"></script> 
 7     <script src="http://cdn.datatables.net/1.10.4/js/jquery.dataTables.min.js"></script> 
 8     <script>
 9     $(document).ready(function(){
10     $(‘#example‘).dataTable();
11     });
12     </script>
13     <meta charset=utf-8">
14     <title><%= title %></title>
15   </head>
16   <body>
17    <div class="table-responsive">
18    <table id="example" class="display table table-bordered table-striped table-hover" width="100%">