dataTable插件的使用

var table;
					 table = $("#example").dataTable({
						 "sDom": "<'top'f<'clear'>>t<'bottom'ilpr<'clear'>>",
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　"deferLoading": 10,首次不请求接口的初始化表格
						 "bRetrieve": true,      //用于指明当履行dataTable绑按时，是否返回DataTable对象
						 "bProcessing": true,    //以指定当正在处理惩罚数据的时辰，是否显示“正在处理惩罚”这个提示信息
						 "bServerSide": true,   //通过服务端来取数据,是否阻止分页
						 "bAutoWidth": true,     //是否主动策画表格各列宽度   false
						 "ordering":false,       //禁用排序去掉图标
						 "bFilter": false,       //是否启用客户端过滤功能
						 "sort": "position",
						 "aaSorting": [         //指定按多列数据排序的根据
							 [0, "desc"]
						 ],
						 "bStateSave": false,    //是否打开客户端状况记录功能
						 "iDisplayLength": 10,   //用于指定一屏显示的条数，需开启分页器
						 "iDisplayStart": 0,    //用于指定从哪一条数据开端显示到表格中去
						 "dom": "Bfrtip",
						 "fnServerParams": function(aoData) {
							 aoData.push({
								 "name": "gameId",    //游戏id
								 "value": $('#gameId').val()
							 }, {
								 "name": "name",    //姓名
								 "value": $('#name').val()
							 }, {
								 "name": "tel",    //电话
								 "value": $('#tel').val()
							 },  {
								 "name": "startDate",
								 "value":$("#startDate").val()
							 },{
								"name":"endDate",
								"value":$("#endDate").val()
							 },
							 {
								 "name": "cityCode",
								 "value": $('#cityCode').val()
							 }, {
								 "name": "districtCode",
								 "value": $('#districtCode').val()
							 },{
								 "name":"provinceCode",
								 "value":$("#provinceCode").val()
							 });

						 },
						 "fnDrawCallback": function(oSettings) {
							 var api = this.api();
							 var startIndex= api.context[0]._iDisplayStart;//获取到本页开始的条数
							 api.column(0).nodes().each(function(cell, i) {
								 cell.innerHTML = startIndex + i + 1;
							 });	
							$("tr").parents("tbody").children(":last-child").children(":nth-child(6)").children().addClass("hoves")
							$("tr").parents("tbody").children(":nth-child(9)").children(":nth-child(6)").children().addClass("hoves")
							$("tr").parents("tbody").children(":last-child").children(":nth-child(7)").children().addClass("hoves")
							$("tr").parents("tbody").children(":nth-child(9)").children(":nth-child(7)").children().addClass("hoves")
							$(".experience1").unbind('hover').hover(function(){
								$(this).next().toggle();
							}).unbind('hover'),
							$(".origin1").unbind('hover').hover(function(){
								$(this).next().toggle();
							}).unbind('hover')
								 },   //draw画 ，这个应该是重绘的回调函数
						 "sAjaxSource": "${base}/joinBusiness/getPartnerList?stage=1",      //请求地址
						// "sAjaxSource": "http://172.16.81.36/operate/joinBusiness/getPartnerList",      //请求地址
						 "sServerMethod":"POST",
						 "sScrollX": "100%",      //是否开启程度迁移转变，以及指定迁移转变区域大小
						 "bScrollCollapse": true,    //指定恰当的时辰缩起迁移转变视图
						 "aoColumns": [{             //数据表列值
							 "mDataProp": "",
							 "orderable": false, // 禁用排序
							 "sDefaultContent": "",
							 "bSortable": false,
							 "aTargets": [0]
						 }, {
							 "mDataProp": "name",
							 "sDefaultContent": "",
							 "bSortable": false,
							 "aTargets": [1]
						 }, {
							 "mDataProp": "tel",
							 "sDefaultContent": "",
							 "bSortable": false,
							 "aTargets": [2]
						 }, {
							 "mDataProp": "wechat",
							 "sDefaultContent": "",
							 "bSortable": false,
							 "aTargets": [3]
						 }, {
							 "mDataProp": "",     //合作区域
							 "sDefaultContent": "",
							 "mRender": function(data,type,full){
								 var provinceName = full.provinceName!=null?full.provinceName:'';
								 var cityName = full.cityName!=null?full.cityName:'';
								 var districtName = full.districtName!=null?full.districtName:'';
								 var str;
								 str="<div><p>"+provinceName+"</p><p>"+cityName+"</p><p>"+districtName+"</p></div>";
								 return str;

							 },
							 "bSortable": false,
							 "aTargets": [4]
						 }, {
							 "mDataProp": "experience",
							 "sDefaultContent": "",
							 "bSortable": false,
							 "mRender": function(data,type,full){
								if(full.experience!=null){
									 var str = full.experience;
									 var strs = [];
									 var s=0;
									 var length=0;
									 var flag=0;
									 var domTd='';
									 for(var i=0;i<str.length;i++){
										 s++;
										 if(/[u4e00-u9fa5]/.test(str.charAt(i))){
											 s++;
										 }
									 }
									 for(var i=0;i<str.length;i++){
										 flag++;
										 if(/[u4e00-u9fa5]/.test(str.charAt(i))){
											 flag++;
										 }
										 if(flag>30){
											 break;
										 }
										 length++;
									 }

									 if(s>30){
										str=str.substr(0,length);
										var times = Math.ceil(str.length/7);
										for(var i=0;i<times;i++){
											strs.push(str.slice(i*7,(i+1)*7));
										}
										domTd='<p tabindex="0" class="experience experience1"  role="button" data-toggle="popover" data-trigger="focus" data-content="And heres some amazing content  Its very engaging Right?">'+strs.join("</br>")+'...</p><div>'+full.experience+'</div>'
									 }else{
										 domTd='<p class="experience experience1" >'+str+'</p><div>'+full.experience+'</div>'
									 }
									 return domTd;
									}
							 },
						 }, {
							 "mDataProp": "origin",
							 "sDefaultContent": "",
							 "bSortable": false,
							 "mRender": function(data,type,full){
								// console.log(full)
								 if(full.origin==1){
									return "<p class='origin origin1'>"+full.gameName+"公众号</p><div>"+full.gameName+"公众号</div>"
								}else if(full.origin==2){
									return "<p  class='origin origin1' >"+full.gameName+"客户端</p><div>"+full.gameName+"客户端</div>"
								}
						 },
							 "aTargets": [6]
						 },  {
							 "mDataProp": "isVip",
							 "sDefaultContent": "",
							 "bSortable": false,
							 "mRender": function(data,type,full){
								 if(full.isVip==1){
										return "<p class='isVip isVip1'>是</p>"
									}else if(full.isVip==2){
										return "<p class='isVip isVip1'>否</p>"
									}else{
										return "<p class='isVip isVip1'></p>"
									}
						 },
							 "aTargets": [7]
						 }, {
							 "mDataProp": "referrer",
							 "sDefaultContent": "",
							 "bSortable": false,
							 "aTargets": [8]
						 }, {
							 "mDataProp": "",
							 "sDefaultContent": "",
							 "mRender": function(data,type,full){
									 var str = '';
										 str += '<@shiro.hasPermission name="oop_join_business_pass"><a class="adopt" style="color:#1ab394" href="${base}/joinBusiness/toPass?tel='+full.tel+'&name='+full.name+'&id='+full.id+'&wechat='+full.wechat+'&experience='+full.experience+'&provinceCode='+full.provinceCode+'&cityCode='+full.cityCode+'&provinceName='+full.provinceName+'&cityName='+full.cityName+'&districtName='+full.districtName+'">通过</a></@shiro.hasPermission>    <@shiro.hasPermission name="oop_join_business_nopass"><a  href="${base}/joinBusiness/toRefuse?tel='+full.tel+'&name='+full.name+'&id='+full.id+'&wechat='+full.wechat+'&experience='+full.experience+'&provinceCode='+full.provinceCode+'&cityCode='+full.cityCode+'&provinceName='+full.provinceName+'&cityName='+full.cityName+'&districtName='+full.districtName+'&isVip='+full.isVip+'" style="color:#1ab394" class="eliminate">不通过</a></@shiro.hasPermission>';
									 return str
							 },
							 "bSortable": false,
							 "aTargets": [9]
						 }, ],
						 "oLanguage": { // 国际化配置
							 "sProcessing": "正在获取数据，请稍后...",  //描述用户在输入框输入过滤条件时的动作
							 "sLengthMenu": "显示 _MENU_ 条",  // 当使用Ajax数据源和表格在第一次被加载搜集数据的时候显示的字符串，该信息在一个空行显示
							 "sZeroRecords": "没有您要的内容",
							 "sInfo": "",   //表格中没有数据是展示的表格信息 通常情况下格式会符合sinfo的格式
							 "sInfoEmpty": "",  //当用户过滤表格中的信息的时候，该字符串会被附加到信息字符串的后面，从而给出过滤器强度的直观概念
							 "sInfoFiltered": "",  //使用该属性可以很方便的向表格信息字符串中添加额外的信息，被添加的信息在任何时候都会被附加到表格信息组件的后面
							 "sInfoPostFix": "",   //DataTable有内建的格式化数字的工具，可以用来格式化表格信息中较大的数字默认情况下会自动调用，可以使用该选项来自定义分割的字符
							 "sSearch": "搜索",
							 "sUrl": "",
							 "oPaginate": {
								 "sFirst": "首页",
								 "sPrevious": "上页",
								 "sNext": "下页",
								 "sLast": "末页"
							 }
						 }
					 });
					 $("#search").on("click", function() {
						  table.fnDraw();//table.api().ajax.reload();


					 });

　　返回的数据格式

{
"iTotalRecords":1,
"iTotalDisplayRecords":1,
"iDisplayStart":"0",
"pageDisplayLength":"10",
"sEcho":"1",
"iSortCol_0":null,
"sSortDir_0":null,
"aaData":[
　　　　　　　　{"id":1,"gameName":"邵阳麻将","deviceTypeName":"全部","pushStatusName":"待推送","pushTime":"2017-11-08 15:16:25","pushStatus":"wait_push","operator":"","provinceCode":"430000","gameId":10001,"deviceType":"all","title":"方式是的方式","content":"二维若无热无","playerIds":"12332"}
　　　　　　],
 "other":null,
 "ssearch":null
}

　　可使用的dataTable

var table;
				table = $("#stateList").dataTable({
					"sDom": "<'top'f<'clear'>>t<'bottom'ilpr<'clear'>>",
					"bProcessing": true,
					"bServerSide": true,
					"ordering": false,
					"bFilter": false,
					"bStateSave": false,
					"iDisplayLength": 10,
					"iDisplayStart": 0,
					"dom": "Bfrtip",
					"sServerMethod": "GET",
					"fnServerParams": function(aoData) {
						aoData.push({
							"name": "provinceCode",
							"value": $('.province').val()
						},{
							"name": "gameId",
							"value": $('.game').val()
						},{
							"name": "status",
							"value": $('.status').val()
						})
					},
					"sAjaxSource": "${base}/msg/system/list?t=" + Math.random(),
					"sScrollX": "100%",
					"bScrollCollapse": true,
					"fnDrawCallback": function(oSettings) {
						$(function () {
							  $('[data-toggle="tooltip"]').tooltip();
							})
						$('.dele').click(function(){
							 var that=this;
							 bootbox.confirm({
							       buttons: {
							           confirm: {
							               label: '确认',
							               className: 'btn-success'
							           },
							           cancel: {
							               label: '取消',
							               className: 'btn-default'
							           }
							       },
							       message: '是否确认删除',
							       callback:function(result){
							    	   if(result){
							    			$.ajax({
												type:'get',
												url:'${base}/msg/system/delete/'+$(that).attr('data-id'),
												success:function(res){
													if(res.meta.code==2000){
														$(that).parent().parent().remove();
														alert('删除成功')
													}else{
														alert(res.meta.message)
													}
												}
												
											}) 
							    	   }
							       },
							       title:'提示'
							   })
								
							
							})
					
					},
					"aoColumns": [ {
						"mDataProp": "contents",
						"sDefaultContent": "",
						"bSortable": false,
						"mRender":function(data, type, full){
							var str='<div style="text-align:left;">';
							var contents=full.contents;
							if(contents.length==1){
								if(contents[0].content.length>20){
									var content=contents[0].content.substr(0,20)+'...';
								}else{
									var content=contents[0].content;
								}
								str+='<p>标题：'+contents[0].title+'</p><p data-toggle="tooltip" data-placement="top" title="'+contents[0].content+'">内容：'+content+'</p></div>'
							}else{
								for(var i=0;i<contents.length;i++){
									if(contents[i].content.length>20){
										var content=contents[i].content.substr(0,20)+'...';
									}else{
										var content=contents[i].content;
									}
									str+='<p>推送文案'+(i+1)+'</p><p>标题：'+contents[i].title+'</p><p data-toggle="tooltip" data-placement="top" title="'+contents[i].content+'">内容：'+content+'</p>'
								}
								str+='</div>'
							}
							
							return str;
						},
						"aTargets": [0]
					}, {
						"mDataProp": "pushCrowdName",
						"sDefaultContent": "",
						"bSortable": false,
						"aTargets": [1]
					}, {
						"mDataProp": "deviceTypeName",
						"sDefaultContent": "",
						"bSortable": false,
						"aTargets": [2]
					},{
						"mDataProp": "pushTypeName",
						"sDefaultContent": "",
						"bSortable": false,
						"aTargets": [3]
					}, {
						"mDataProp": "gameName",
						"sDefaultContent": "",
						"bSortable": false,
						"aTargets": [4]
					}, {
						"mDataProp": "pushTime",
						"sDefaultContent": "",
						
						"bSortable": false,
						"aTargets": [5]
					},{
						"mDataProp": "statusName",
						"sDefaultContent": "",
						"bSortable": false,
						"aTargets": [6]
					},{
						"mDataProp": "operator",
						"sDefaultContent": "",
						"bSortable": false,
						"aTargets": [7]
					}, {
						"mDataProp": "Operator",
						"sDefaultContent": "",
						"bSortable": false,
						"mRender": function(data, type, full) {
							var str = '';
							<@shiro.hasPermission name="oop_player_sysmsg_edit">
								str += '<a style="margin-left:15px;"  href="${base}/msg/systemChange?id='+full.id+'&flag=1-1">修改</a>';
							</@shiro.hasPermission>
							<@shiro.hasPermission name="oop_player_sysmsg_del">
								str += '<a class="dele" style="margin-left:15px;" data-id="'+full.id+'" href="javascript:;">删除</a>';
							</@shiro.hasPermission>
							return str;
						},
						"aTargets": [8]
					}],
					"oLanguage": { // 国际化配置
						 "sProcessing": "正在获取数据，请稍后...",  //描述用户在输入框输入过滤条件时的动作
						 "sLengthMenu": "显示 _MENU_ 条",  // 当使用Ajax数据源和表格在第一次被加载搜集数据的时候显示的字符串，该信息在一个空行显示
						 "sZeroRecords": "没有您要的内容",
						 "sInfo": "",   //表格中没有数据是展示的表格信息 通常情况下格式会符合sinfo的格式
						 "sInfoEmpty": "",  //当用户过滤表格中的信息的时候，该字符串会被附加到信息字符串的后面，从而给出过滤器强度的直观概念
						 "sInfoFiltered": "",  //使用该属性可以很方便的向表格信息字符串中添加额外的信息，被添加的信息在任何时候都会被附加到表格信息组件的后面
						 "sInfoPostFix": "",   //DataTable有内建的格式化数字的工具，可以用来格式化表格信息中较大的数字默认情况下会自动调用，可以使用该选项来自定义分割的字符
						 "sSearch": "搜索",
						 "sUrl": "",
						 "oPaginate": {
							 "sFirst": "首页",
							 "sPrevious": "上页",
							 "sNext": "下页",
							 "sLast": "末页"
						 }
					 }
				});
				
				$(document).ready(function(){
					$('#search').click(function(){
						table.api().ajax.reload();
					})
					
				})