转 Datatables中文API——基本参数
鉴于自己一直在使用datatables,发现这是个很不错的表格插件,但是好的东西都是英文的,所以我结合自己的使用经验,把官网的英文api做下简单的翻译,同时也希望大家把自己的使用经验一起分享出来,让我们更好的使用datatables,本帖将会持续更新……
从基本属性开始吧
bAutoWidth :启用或禁用自动列宽度的计算。
|
默认值
|
true
|
|
类型
|
boolean
|
- $(document).ready( function () {
- $('#example').dataTable( {
- "bAutoWidth": false //关闭后,表格将不会自动计算表格大小,在浏览器大化小化的时候会挤在一坨
- } );
- } );
复制代码
bDeferRender :根据官网的介绍翻译过来就是,延期渲染,可以有个速度的提升,当datatable 使用Ajax或者JS源表的数据。这个选项设置为true,将导致datatable推迟创建表元素每个元素,直到他们都创建完成——本参数的目的是节省大量的时间。
|
默认值:
|
false
|
|
类型:
|
boolean
|
- $(document).ready( function() {
- var oTable = $('#example').dataTable( {
- "sAjaxSource": "sources/arrays.txt",
- "bDeferRender": true //这个参数我个人没有使用过,到底是不是这个效果,大家自己去尝试一下
- } );
- } );
复制代码
bFilter :这个很容易明白,启用或禁用过滤数据。在datatable过滤是“智能”,它允许用户 最终输入多个关键字(空格分隔),和每一行数据匹配,即使不是在被指定的顺序(这允许匹配多个列)。注意,如果您希望使用过滤,在datatable中必 须设置为true,如果要删除默认过滤输入框和留住过滤功能,请使用{ @link DataTable.defaults.sDom }。这个最后一句不明白,不知道大家怎么理解。
|
默认值:
|
true
|
|
类型:
|
boolean
|
- $(document).ready( function () {
- $('#example').dataTable( {
- "bFilter": false
- } );
- } );
复制代码
bJQueryUI :这个不用多说了,一看就懂,启用jQuery UI样式,(需要在页面添加jQuery的样式文件)。
|
默认值:
|
false
|
|
类型:
|
boolean
|
- $(document).ready( function() {
- $('#example').dataTable( {
- "bJQueryUI": true
- } );
- } );
复制代码
bLengthChange :开启一页显示多少条数据的下拉菜单,允许用户从下拉框(10、25、50和100),注意需要分页(bPaginate:true)。
|
默认值:
|
true
|
|
类型:
|
boolean
|
- $(document).ready( function () {
- $('#example').dataTable( {
- "bLengthChange": false,
复制代码
bPaginate :开启分页功能,如果不开启,将会全部显示
|
默认值:
|
true
|
|
类型:
|
boolean
|
- $(document).ready( function () {
- $('#example').dataTable( {
- "bPaginate": false
- } );
- } );
复制代码
bProcessing :开启读取服务器数据时显示正在加载中……特别是大数据量的时候,开启此功能比较好
|
默认值:
|
false
|
|
类型:
|
boolean
|
- $(document).ready( function () {
- $('#example').dataTable( {
- "bProcessing": true
- } );
- } );
复制代码
bScrollInfinite :是否开启不限制长度的滚动条(和sScrollY属性结合使用),不限制长度的滚动条意味着当用户拖动滚动条的时候DataTable会不断加载数据当数据集十分大的时候会有些用处,该选项无法和分页选项同时使用,分页选项会被自动禁止,注意,额外推荐的滚动条会优先与该选项
|
默认值:
|
false
|
|
类型:
|
boolean
|
- $(document).ready( function() {
- $('#example').dataTable( {
- "bScrollInfinite": true,
- "bScrollCollapse": true,
- "sScrollY": "200px"//长200像素
- } );
- } );
复制代码
bServerSide :开启服务器模式,使用服务器端处理配置datatable。注意:sAjaxSource参数也必须被给予为了给datatable源代码来获取所需的 数据对于每个画。 这个翻译有点别扭。开启此模式后,你对datatables的每个操作 每页显示多少条记录、下一页、上一页、排序(表头)、搜索,这些都会传给服务器相应的值。
|
默认值:
|
false
|
|
类型:
|
boolean
|
- $(document).ready( function () {
- $('#example').dataTable( {
- "bServerSide": true,
- "sAjaxSource": "xhr.php"
- } );
- } );
复制代码
bInfo :启用或禁用表信息显示。这显示了关于数据的信息,目前在网页上,包括信息过滤数据,如果行为被执行。这个参数在bServerSide配置后需要用到。
|
默认值:
|
true
|
|
类型:
|
boolean
|
- $(document).ready( function () {
- $('#example').dataTable( {
- "bInfo": false//如果这个参数不穿到后台去,服务器分页会报错,据说这个参数包含了表的所有信息
- } );
- } );
复制代码
bSort :开启排序功能,每一列都有排序功能,如果关闭了,排序功能将失效,也可以自定义排序功能。单个列的排序可以禁用“bSortable”选项。
|
默认值:
|
true
|
|
类型:
|
boolean
|
- $(document).ready( function () {
- $('#example').dataTable( {
- "bSort": false
- } );
- } );
复制代码
bSortClasses :是否在当前被排序的列上额外添加sorting_1,sorting_2,sorting_3三个class,当该列被排序的时候,可以切换其背景颜色,该选项作为一个来回切换的属性会增加执行时间(当class被移除和添加的时候),当对大数据集进行排序的时候你或许希望关闭该选项
|
默认值:
|
true
|
|
类型:
|
boolean
|
- $(document).ready( function () {
- $('#example').dataTable( {
- "bSortClasses": false
- } );
- } );
复制代码
bStateSave :是否开启状态保存,当选项开启的时候会使用一个cookie保存表格展示的信息的状态,例如分页信息,展示长度,过滤和排序等。这样当终端用户重新加载这个页面的时候可以使用以前的设置
|
默认值:
|
false
|
|
类型:
|
boolean
|
- $(document).ready( function () {
- $('#example').dataTable( {
- "bStateSave": true
- } );
- } );
复制代码
sScrollX :是否开启水平滚动,当一个表格过于宽以至于无法放入一个布局的时候,或者表格有太多列的时候,你可以开启该选项从而在一个可横向滚动的视图里面展示表格,该属性可以是css设置,或者一个数字(作为像素量度来使用)
|
默认值:
|
blank string - i.e. disabled
|
|
类型:
|
string
|
- $(document).ready( function() {
- $('#example').dataTable( {
- "sScrollX": "100%",
- "bScrollCollapse": true
- } );
- } );
复制代码
sScrollY:是否开启垂直滚动,垂直滚动会驱使DataTable设置为给定的长度,任何溢出到当前视图之外的数据可以通过垂直滚动进行察看当在小范围区域中显示大量数据的时候,可以在分页和垂直滚动中选择一种方式,该属性可以是css设置,或者一个数字(作为像素量度来使用)
|
默认值:
|
blank string - i.e. disabled
|
|
类型:
|
string
|
- $(document).ready( function() {
- $('#example').dataTable( {
- "sScrollY": "200px",
- "bPaginate": false
- } );
- } );
复制代码
本节完毕,推荐是用ctrl+f查找使用
转 Datatables中文API——基本参数的更多相关文章
- [转载]fullPage.js中文api 配置参数~
fullPage.js中文api 配置参数 选项 类型 默认值 说明 verticalCentered 字符串 true 内容是否垂直居中 resize 布尔值 false 字体是否随着窗口缩放而缩放 ...
- Datatables中文API——回调函数
fnCookieCallback:还没有使用过 $(document).ready(function () { $('#example').dataTable({ "fnCookieCall ...
- JQuery Datatables Columns API 参数详细说明
---恢复内容开始--- Data Tables: http://datatables.NET/ Version: 1.10.0 Columns说明 虽然我们可以通过DOM直接获取DataTables ...
- turn.js中文API 写一个翻页效果的参数详细解释
$('.flipbook').turn({ width: 922, height: 600, elevation: 50, gradients: true, a ...
- [置顶] COcos2d-X 中文API
本文来自http://blog.csdn.net/runaying ,引用必须注明出处! COcos2d-X 中文API 温馨提醒:使用二维码扫描软件,就可以在手机上访问我的博客啦!另外大家可以访问另 ...
- Android 中文 API (40) —— RatingBar
Android 中文 API (40) —— RatingBar 前言 本章内容是 android.widget.RatingBar,译为"评分条",版本为Android 2.2 ...
- (转)jQuery验证控件jquery.validate.js使用说明+中文API
官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation jQuery plugin: Validation 使用说明 转载 ...
- Android 中文API (70) —— BluetoothDevice[蓝牙]
前言 本章内容是 android.bluetooth.BluetoothDevice,为Android蓝牙部分的章节翻译.蓝牙设备类,代表了蓝牙通讯国足中的远端设备.版本为 Android 2.3 ...
- Android 中文API (69) —— BluetoothAdapter[蓝牙]
前言 本章内容是 android.bluetooth.BluetoothAdapter,为Android蓝牙部分的章节翻译.本地蓝牙设备的适配类,所有的蓝牙操作都要通过该类完成.版本为 Androi ...
随机推荐
- tkprof工具详解二(一些实例)
TKPROF是一个可执行文件,自带在Oracle Server软件中,无需额外的安装. 该工具文件可以用来解析ORACLE的SQL TRACE(10046) 以便生成更可读的内容. 实际上tkpro ...
- Visual Studio 2015的Web扩展包
过去几年,Visual Studio扩展功能生态系统得到了蓬勃发展,社区贡献出了大量优秀的扩展,其中也包括大量针对Web开发的扩展.但是很多时候,感觉寻找.安装.更新好 几个扩展,总显得比较麻烦.如果 ...
- ZooKeeper 的羊群效应
一个需要避免的问题是当一个特定的znode 改变的时候ZooKeper 触发了所有watches 的事件. 举个例子,如果有1000个客户端watch 一个znode的exists调用,当这个节点被创 ...
- Entity Framework Code First for SQL Compact
这篇博客将介绍EF Code First中如何使用SQL Compact.SQL Compact是微软推出的免费的关系型数据库,目前最新版本是SQL Compact 4.0.微软的开发工具VS 201 ...
- [Tools] 远程登录surface字体过大解决方法
[背景] 这两天一直远程登录surface,使用surface干活,每次分辨率超大,看着就感觉像显示驱动没装好似的,必须得找个办法来设置 [开工] 在surface上设置低一点的分辨率,成功,但是远程 ...
- poj 3264 【线段树】
此题为入门级线段树 题意:给定Q(1<=Q<=200000)个数A1A2…AQ,多次求任一区间Ai-Aj中最大数和最小数的差 #include<algorithm> #incl ...
- Understanding Execution Governors and Limits
在编写Salesforce后台代码的时候,如果数据量比较大,或者需要与数据库的交互比较频繁的话,那么会抛出一些限制的异常,来提示你让你做进一步的修改. 有这些限制实质上是跟Salesforce是一个云 ...
- poj2385 dp(递推)
题目链接 :http://bak3.vjudge.net/contest/136499#problem/D 题意: //转移方程dp[i][j]=max(dp[i-1][j],dp[i-1][j-1] ...
- ASCIL码和字符的转换
1.在python中: 字符-->ASCIL 用ord函数 ASCIL-->字符 用chr函数 下面是一个输入小写字母转换为大写字母输出的例子: # -*- coding: utf-8 - ...
- three.js 显示一个绿色的正方体
第一个框架的效果是显示一个绿色的正方体 <!DOCTYPE html> <html> <head> <title></title> < ...