jquery DataTable函数选项不起作用

时间:2016-12-06 11:53:08

标签: javascript jquery html datatables

我想用DataTable函数更改我的表的某些设置,但参数

paging: false,
scrollY: 400

对桌子没有任何影响。

<html>
<head>
  <meta charset=utf-8 />
  <link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/css/jquery.dataTables.css">
</head>
<body>


<table id='example'>
  <thead>
    <tr><th class='site_name'>Name</th><th>Url </th><th>Type</th><th>Last modified</th></tr>
  </thead>
  <tbody>
  </tbody>
</table>


  <script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js"></script>
  <script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/jquery.dataTables.min.js"></script>

  <script>

$("#example").DataTable({
  "aaData":[
    ["Sitepoint","http://sitepoint.com","Blog","2013-10-15 10:30:00"],
    ["Flippa","http://flippa.com","Marketplace","null"],
    ["99designs","http://99designs.com","Marketplace","null"],
    ["Learnable","http://learnable.com","Online courses","null"],
    ["Rubysource","http://rubysource.com","Blog","2013-01-10 12:00:00"]
  ],
    paging: false,
    scrollY: 400
}
);

  </script>
</body>
</html>

我从https://www.sitepoint.com/working-jquery-datatables/获取了代码,并从https://datatables.net/manual/options获取了选项说明。

2 个答案:

答案 0 :(得分:2)

正如您在documentation中所看到的那样:

  

分页:启用或禁用表分页。自:DataTables 1.10

这意味着您必须更改库版本:

&#13;
&#13;
$("#example").DataTable({
  "aaData":[
    ["Sitepoint","http://sitepoint.com","Blog","2013-10-15 10:30:00"],
    ["Flippa","http://flippa.com","Marketplace","null"],
    ["99designs","http://99designs.com","Marketplace","null"],
    ["Learnable","http://learnable.com","Online courses","null"],
    ["Learnable","http://learnable.com","Online courses","null"],
    ["Learnable","http://learnable.com","Online courses","null"],
    ["Rubysource","http://rubysource.com","Blog","2013-01-10 12:00:00"]
  ],
  paging: false,
  scrollY: 400
}
                       );
&#13;
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css">
<script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js"></script>
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>


<table id='example'>
    <thead>
    <tr><th class='site_name'>Name</th><th>Url </th><th>Type</th><th>Last modified</th></tr>
    </thead>
    <tbody>
    </tbody>
</table>
&#13;
&#13;
&#13;

答案 1 :(得分:1)

这是对Datatables版本的处理方式&lt; 1.10

"bPaginate": false,
"sScrollY": "400px",