保存状态
DataTables 设置
stateSave 选项后，可以保存最后一次分页信息、排序信息，当页面刷新，或者重新进入这个页面，恢复上次的状态
这个状态的保存用了html5的本地储存和session储存，这样更加有效率。如果你的数据是异步获取的，你可以使用
stateSaveCallback 和
stateLoadCallback 选项
默认情况下，这个状态会保存2小时，如果你希望设置的时间更长，通过设置参数
stateDuration 来初始化表格
这个参数值也可以控制是本地储存(0~更大)还是session储存(-1)
下面的例子展示了 DataTables 设置
stateSave 选项初始化后，实现的状态保存
| 姓名 | 职位 | 工作地点 | 年龄 | 入职时间 | 年薪 |
|---|---|---|---|---|---|
| 姓名 | 职位 | 工作地点 | 年龄 | 入职时间 | 年薪 |
| 李霞 | 系统架构师 | 北京 | 61 | 2011/04/25 | ¥320,800 |
| 杜重治 | 会计 | 上海 | 63 | 2011/07/25 | ¥170,750 |
| 陈锋 | 初级开发者 | 深圳 | 66 | 2009/01/12 | ¥86,000 |
| 郑伯宁 | 高级JavaScript开发者 | 北京 | 22 | 2012/03/29 | ¥433,060 |
| 施华军 | 会计 | 上海 | 33 | 2008/11/28 | ¥162,700 |
| 吴书振 | 集成专家 | 南京 | 61 | 2012/12/02 | ¥372,000 |
| 张宁 | 销售代表 | 深圳 | 59 | 2012/08/06 | ¥137,500 |
| 马世波 | 集成专家 | 上海 | 55 | 2010/10/14 | ¥327,900 |
| 张章 | Javascript开发者 | 深圳 | 39 | 2009/09/15 | ¥205,500 |
| 张竹影 | 软件工程师 | 北京 | 23 | 2008/12/13 | ¥103,600 |
| 韩庆福 | 办公室主管 | 广州 | 30 | 2008/12/19 | ¥90,560 |
| 刘勇 | 客户服务 | 北京 | 22 | 2013/03/03 | ¥342,000 |
| 张忆湫 | 大区经理 | 深圳 | 36 | 2008/10/16 | ¥470,600 |
| 尚志兴 | 高级营销设计师 | 广州 | 43 | 2012/12/18 | ¥313,500 |
| 杜若芳 | 大区经理 | 广州 | 19 | 2010/03/17 | ¥385,750 |
| 杨乔松 | 营销设计师 | 广州 | 66 | 2012/11/27 | ¥198,500 |
| 闫跃进 | CEO | 南京 | 64 | 2010/06/09 | ¥725,000 |
| 孙凯 | 系统管理员 | 南京 | 59 | 2009/04/10 | ¥237,500 |
| 赖祥校 | 软件工程师 | 广州 | 41 | 2012/10/13 | ¥132,000 |
| 郭晖 | 人事主管 | 北京 | 35 | 2012/09/26 | ¥217,500 |
| 贺光明 | 技术主管 | 南京 | 30 | 2011/09/03 | ¥345,000 |
| 邓小燕 | CMO | 南京 | 40 | 2009/06/25 | ¥675,000 |
| 白莉惠 | 售前支持 | 南京 | 21 | 2011/12/12 | ¥106,450 |
| 杨海霞 | 销售代表 | 成都 | 23 | 2010/09/20 | ¥85,600 |
| 利旭日 | CEO | 广州 | 47 | 2009/10/09 | ¥1,200,000 |
| 范永胜 | 开发者 | 北京 | 42 | 2010/12/22 | ¥92,575 |
| 于怀斌 | 大区经理 | 苏州 | 28 | 2010/11/14 | ¥357,650 |
| 赵淑娜 | 软件工程师 | 深圳 | 28 | 2011/06/07 | ¥206,850 |
| 张淑杰 | COO | 深圳 | 48 | 2010/03/11 | ¥850,000 |
| 陈俊军 | 区域销售 | 上海 | 20 | 2011/08/14 | ¥163,000 |
| 郭增杰 | 集成专家 | 成都 | 37 | 2011/06/02 | ¥95,400 |
| 林云 | 开发者 | 广州 | 53 | 2009/10/22 | ¥114,500 |
| 郭述龙 | 技术作者 | 广州 | 27 | 2011/05/07 | ¥145,000 |
| 杨军 | 团队主管 | 深圳 | 22 | 2008/10/26 | ¥235,500 |
| 张海龙 | 售后支持 | 北京 | 46 | 2011/03/09 | ¥324,050 |
| 耿静 | 营销设计师 | 深圳 | 47 | 2009/12/09 | ¥85,675 |
| 刘晋荣 | 办公室主管 | 深圳 | 51 | 2008/12/16 | ¥164,500 |
| 孙宁 | 秘书 | 深圳 | 41 | 2010/02/12 | ¥109,850 |
| 邢洪锐 | 财务总监 | 深圳 | 62 | 2009/02/14 | ¥452,500 |
| 陈云云 | 办公室主管 | 广州 | 37 | 2008/12/11 | ¥136,200 |
| 张禄 | 主任 | 南京 | 65 | 2008/09/26 | ¥645,750 |
| 王增凤 | 技术支持工程师 | 苏州 | 64 | 2011/02/03 | ¥234,500 |
| 沈捷 | 软件工程师 | 广州 | 38 | 2011/05/03 | ¥163,500 |
| 汪化言 | 技术支持工程师 | 上海 | 37 | 2009/08/19 | ¥139,575 |
| 杨正机 | 开发者 | 南京 | 61 | 2013/08/11 | ¥98,540 |
| 戴向军 | 技术支持工程师 | 深圳 | 47 | 2009/07/07 | ¥87,500 |
| 王延芳 | 数据分析工程师 | 苏州 | 64 | 2012/04/09 | ¥138,575 |
| 沈健 | 软件工程师 | 南京 | 63 | 2010/01/04 | ¥125,250 |
| 刘伟峰 | 软件工程师 | 深圳 | 56 | 2012/06/01 | ¥115,000 |
| 陆先生 | 初级Javascript开发者 | 北京 | 43 | 2013/02/01 | ¥75,650 |
| 纪虹羽 | 销售代表 | 南京 | 46 | 2011/12/06 | ¥145,600 |
| 肖艳 | 大区经理 | 广州 | 47 | 2011/03/21 | ¥356,250 |
| 沈国金 | 系统管理员 | 广州 | 21 | 2009/02/27 | ¥103,500 |
| 王燕峰 | 开发者 | 深圳 | 30 | 2010/07/14 | ¥86,500 |
| 徐若琳 | 大区经理 | 北京 | 51 | 2008/11/13 | ¥183,000 |
| 徐成业 | Javascript开发者 | 苏州 | 29 | 2011/06/27 | ¥183,000 |
| 李岸白 | 客户服务 | 南京 | 27 | 2011/01/25 | ¥112,000 |
data-plugin="dataTable" data-stateSave="true"$(function () {
$('#dataTableExample').DataTable($.concatCpt('dataTable'));
});<table class="table table-bordered table-hover dataTable table-striped w-full text-nowrap" id="dataTableExample" data-plugin="dataTable" data-stateSave="true">
<thead>
<tr>
<th>姓名</th>
<th>职位</th>
<th>工作地点</th>
<th>年龄</th>
<th>入职时间</th>
<th>年薪</th>
</tr>
</thead>
<tfoot>
<tr>
<th>姓名</th>
<th>职位</th>
<th>工作地点</th>
<th>年龄</th>
<th>入职时间</th>
<th>年薪</th>
</tr>
</tfoot>
<tbody>
<tr>
<td>李霞</td>
<td>系统架构师</td>
<td>北京</td>
<td>61</td>
<td>2011/04/25</td>
<td>¥320,800</td>
</tr>
<tr>
<td>杜重治</td>
<td>会计</td>
<td>上海</td>
<td>63</td>
<td>2011/07/25</td>
<td>¥170,750</td>
</tr>
<tr>
<td>陈锋</td>
<td>初级开发者</td>
<td>深圳</td>
<td>66</td>
<td>2009/01/12</td>
<td>¥86,000</td>
</tr>
<tr>
<td>郑伯宁</td>
<td>高级JavaScript开发者</td>
<td>北京</td>
<td>22</td>
<td>2012/03/29</td>
<td>¥433,060</td>
</tr>
<tr>
<td>施华军</td>
<td>会计</td>
<td>上海</td>
<td>33</td>
<td>2008/11/28</td>
<td>¥162,700</td>
</tr>
<tr>
<td>吴书振</td>
<td>集成专家</td>
<td>南京</td>
<td>61</td>
<td>2012/12/02</td>
<td>¥372,000</td>
</tr>
<tr>
<td>张宁</td>
<td>销售代表</td>
<td>深圳</td>
<td>59</td>
<td>2012/08/06</td>
<td>¥137,500</td>
</tr>
<tr>
<td>马世波</td>
<td>集成专家</td>
<td>上海</td>
<td>55</td>
<td>2010/10/14</td>
<td>¥327,900</td>
</tr>
<tr>
<td>张章</td>
<td>Javascript开发者</td>
<td>深圳</td>
<td>39</td>
<td>2009/09/15</td>
<td>¥205,500</td>
</tr>
<tr>
<td>张竹影</td>
<td>软件工程师</td>
<td>北京</td>
<td>23</td>
<td>2008/12/13</td>
<td>¥103,600</td>
</tr>
<tr>
<td>韩庆福</td>
<td>办公室主管</td>
<td>广州</td>
<td>30</td>
<td>2008/12/19</td>
<td>¥90,560</td>
</tr>
<tr>
<td>刘勇</td>
<td>客户服务</td>
<td>北京</td>
<td>22</td>
<td>2013/03/03</td>
<td>¥342,000</td>
</tr>
<tr>
<td>张忆湫</td>
<td>大区经理</td>
<td>深圳</td>
<td>36</td>
<td>2008/10/16</td>
<td>¥470,600</td>
</tr>
<tr>
<td>尚志兴</td>
<td>高级营销设计师</td>
<td>广州</td>
<td>43</td>
<td>2012/12/18</td>
<td>¥313,500</td>
</tr>
<tr>
<td>杜若芳</td>
<td>大区经理</td>
<td>广州</td>
<td>19</td>
<td>2010/03/17</td>
<td>¥385,750</td>
</tr>
<tr>
<td>杨乔松</td>
<td>营销设计师</td>
<td>广州</td>
<td>66</td>
<td>2012/11/27</td>
<td>¥198,500</td>
</tr>
<tr>
<td>闫跃进</td>
<td>CEO</td>
<td>南京</td>
<td>64</td>
<td>2010/06/09</td>
<td>¥725,000</td>
</tr>
<tr>
<td>孙凯</td>
<td>系统管理员</td>
<td>南京</td>
<td>59</td>
<td>2009/04/10</td>
<td>¥237,500</td>
</tr>
<tr>
<td>赖祥校</td>
<td>软件工程师</td>
<td>广州</td>
<td>41</td>
<td>2012/10/13</td>
<td>¥132,000</td>
</tr>
<tr>
<td>郭晖</td>
<td>人事主管</td>
<td>北京</td>
<td>35</td>
<td>2012/09/26</td>
<td>¥217,500</td>
</tr>
<tr>
<td>贺光明</td>
<td>技术主管</td>
<td>南京</td>
<td>30</td>
<td>2011/09/03</td>
<td>¥345,000</td>
</tr>
<tr>
<td>邓小燕</td>
<td>CMO</td>
<td>南京</td>
<td>40</td>
<td>2009/06/25</td>
<td>¥675,000</td>
</tr>
<tr>
<td>白莉惠</td>
<td>售前支持</td>
<td>南京</td>
<td>21</td>
<td>2011/12/12</td>
<td>¥106,450</td>
</tr>
<tr>
<td>杨海霞</td>
<td>销售代表</td>
<td>成都</td>
<td>23</td>
<td>2010/09/20</td>
<td>¥85,600</td>
</tr>
<tr>
<td>利旭日</td>
<td>CEO</td>
<td>广州</td>
<td>47</td>
<td>2009/10/09</td>
<td>¥1,200,000</td>
</tr>
<tr>
<td>范永胜</td>
<td>开发者</td>
<td>北京</td>
<td>42</td>
<td>2010/12/22</td>
<td>¥92,575</td>
</tr>
<tr>
<td>于怀斌</td>
<td>大区经理</td>
<td>苏州</td>
<td>28</td>
<td>2010/11/14</td>
<td>¥357,650</td>
</tr>
<tr>
<td>赵淑娜</td>
<td>软件工程师</td>
<td>深圳</td>
<td>28</td>
<td>2011/06/07</td>
<td>¥206,850</td>
</tr>
<tr>
<td>张淑杰</td>
<td>COO</td>
<td>深圳</td>
<td>48</td>
<td>2010/03/11</td>
<td>¥850,000</td>
</tr>
<tr>
<td>陈俊军</td>
<td>区域销售</td>
<td>上海</td>
<td>20</td>
<td>2011/08/14</td>
<td>¥163,000</td>
</tr>
<tr>
<td>郭增杰</td>
<td>集成专家</td>
<td>成都</td>
<td>37</td>
<td>2011/06/02</td>
<td>¥95,400</td>
</tr>
<tr>
<td>林云</td>
<td>开发者</td>
<td>广州</td>
<td>53</td>
<td>2009/10/22</td>
<td>¥114,500</td>
</tr>
<tr>
<td>郭述龙</td>
<td>技术作者</td>
<td>广州</td>
<td>27</td>
<td>2011/05/07</td>
<td>¥145,000</td>
</tr>
<tr>
<td>杨军</td>
<td>团队主管</td>
<td>深圳</td>
<td>22</td>
<td>2008/10/26</td>
<td>¥235,500</td>
</tr>
<tr>
<td>张海龙</td>
<td>售后支持</td>
<td>北京</td>
<td>46</td>
<td>2011/03/09</td>
<td>¥324,050</td>
</tr>
<tr>
<td>耿静</td>
<td>营销设计师</td>
<td>深圳</td>
<td>47</td>
<td>2009/12/09</td>
<td>¥85,675</td>
</tr>
<tr>
<td>刘晋荣</td>
<td>办公室主管</td>
<td>深圳</td>
<td>51</td>
<td>2008/12/16</td>
<td>¥164,500</td>
</tr>
<tr>
<td>孙宁</td>
<td>秘书</td>
<td>深圳</td>
<td>41</td>
<td>2010/02/12</td>
<td>¥109,850</td>
</tr>
<tr>
<td>邢洪锐</td>
<td>财务总监</td>
<td>深圳</td>
<td>62</td>
<td>2009/02/14</td>
<td>¥452,500</td>
</tr>
<tr>
<td>陈云云</td>
<td>办公室主管</td>
<td>广州</td>
<td>37</td>
<td>2008/12/11</td>
<td>¥136,200</td>
</tr>
<tr>
<td>张禄</td>
<td>主任</td>
<td>南京</td>
<td>65</td>
<td>2008/09/26</td>
<td>¥645,750</td>
</tr>
<tr>
<td>王增凤</td>
<td>技术支持工程师</td>
<td>苏州</td>
<td>64</td>
<td>2011/02/03</td>
<td>¥234,500</td>
</tr>
<tr>
<td>沈捷</td>
<td>软件工程师</td>
<td>广州</td>
<td>38</td>
<td>2011/05/03</td>
<td>¥163,500</td>
</tr>
<tr>
<td>汪化言</td>
<td>技术支持工程师</td>
<td>上海</td>
<td>37</td>
<td>2009/08/19</td>
<td>¥139,575</td>
</tr>
<tr>
<td>杨正机</td>
<td>开发者</td>
<td>南京</td>
<td>61</td>
<td>2013/08/11</td>
<td>¥98,540</td>
</tr>
<tr>
<td>戴向军</td>
<td>技术支持工程师</td>
<td>深圳</td>
<td>47</td>
<td>2009/07/07</td>
<td>¥87,500</td>
</tr>
<tr>
<td>王延芳</td>
<td>数据分析工程师</td>
<td>苏州</td>
<td>64</td>
<td>2012/04/09</td>
<td>¥138,575</td>
</tr>
<tr>
<td>沈健</td>
<td>软件工程师</td>
<td>南京</td>
<td>63</td>
<td>2010/01/04</td>
<td>¥125,250</td>
</tr>
<tr>
<td>刘伟峰</td>
<td>软件工程师</td>
<td>深圳</td>
<td>56</td>
<td>2012/06/01</td>
<td>¥115,000</td>
</tr>
<tr>
<td>陆先生</td>
<td>初级Javascript开发者</td>
<td>北京</td>
<td>43</td>
<td>2013/02/01</td>
<td>¥75,650</td>
</tr>
<tr>
<td>纪虹羽</td>
<td>销售代表</td>
<td>南京</td>
<td>46</td>
<td>2011/12/06</td>
<td>¥145,600</td>
</tr>
<tr>
<td>肖艳</td>
<td>大区经理</td>
<td>广州</td>
<td>47</td>
<td>2011/03/21</td>
<td>¥356,250</td>
</tr>
<tr>
<td>沈国金</td>
<td>系统管理员</td>
<td>广州</td>
<td>21</td>
<td>2009/02/27</td>
<td>¥103,500</td>
</tr>
<tr>
<td>王燕峰</td>
<td>开发者</td>
<td>深圳</td>
<td>30</td>
<td>2010/07/14</td>
<td>¥86,500</td>
</tr>
<tr>
<td>徐若琳</td>
<td>大区经理</td>
<td>北京</td>
<td>51</td>
<td>2008/11/13</td>
<td>¥183,000</td>
</tr>
<tr>
<td>徐成业</td>
<td>Javascript开发者</td>
<td>苏州</td>
<td>29</td>
<td>2011/06/27</td>
<td>¥183,000</td>
</tr>
<tr>
<td>李岸白</td>
<td>客户服务</td>
<td>南京</td>
<td>27</td>
<td>2011/01/25</td>
<td>¥112,000</td>
</tr>
</tbody>
</table>