资源描述：
《jquery表格插件datatables用法详解》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。
1、jQuery表格插件datatables用法详解这篇文章主要介绍了jQuery表格插件datatables用法，包括分页、排序等功能,是jQuery表格插件datatables比较基础的部分知识,需要的朋友可以参考下一、Datatables简介DataTables是一个jQuery的表格插件。这是一个高度灵活的工具，依据的基础逐步增强，这将增加先进的互动控制，支持任何HTML表格。主要特点：自动分页处理即时表格数据过滤数据排序以及数据类型自动检测自动处理列宽度可通过CSS定制样式支持隐藏列易用可扩展性和灵活性国际化动态创建表格免费的二、如何使
2、用在做后台的时候并没有美工和前端工程师来配合你做页面，为了显示数据并有一定的美感，我们可以使用jQuery的DataTables插件来帮助我们完成任务1、DataTables的默认配置123$(document).ready(function(){$('#example').dataTable();});2、DataTables的一些基础属性配置123456"bPaginate":true,//翻页功能"bLengthChange":true,//改变每页显示数据数量"bFilter":true,//过滤功能"bSort":false,//排
3、序功能"bInfo":true,//页脚信息"bAutoWidth":true//自动宽度3、数据排序1234567$(document).ready(function(){$('#example').dataTable({"aaSorting":[[4,"desc"]]});});从第0列开始，以第4列倒序排列4、隐藏某些列1234567$(document).ready(function(){$('#example').dataTable({"aoColumnDefs":[{"bSearchable":false,"bVisible":f
4、alse,"aTargets":[2]},{"bVisible":false,"aTargets":[3]}]});});5、国际化12345678910111213141516171819$(document).ready(function(){$('#example').dataTable({"oLanguage":{"sLengthMenu":"每页显示_MENU_条记录","sZeroRecords":"抱歉，没有找到","sInfo":"从_START_到_END_/共_TOTAL_条数据","sInfoEmpty":"没有数据",
5、"sInfoFiltered":"(从_MAX_条数据中检索)","oPaginate":{"sFirst":"首页","sPrevious":"前一页","sNext":"后一页","sLast":"尾页"},"sZeroRecords":"没有检索到数据","sProcessing":""}});});6、排序功能：1234567891011$(document).ready(function(){$('#example').dataTable({"aoColumns":[null,{"a
6、sSorting":["asc"]},{"asSorting":["desc","asc","asc"]},{"asSorting":[]},{"asSorting":[]}]});});7、数据获取支持4种：如下•DOM文档数据•Javascriptarrayjs数组•AjaxsourceAjax请求数据•Serversideprocessing服务器端数据三、实例讲解1、需求：如下图所示，对datatables的内容进行添加，编辑，删除的操作。2、分析：添加功能---单击add按钮，弹出对话框，添加新的内容。编辑功能---单击datata
7、bles可以选中一行，此行改变颜色，即是已经选中，单击edit按钮，弹出dialog，此dialog中的内容是我们选中行的内容。如果没有选中行，点击edit按钮，则不会弹出dialog。当双击datatables中的某一行时，也弹出dialog，并且双击的行改变颜色，dialog中的内容是我们双击行的内容。删除功能---单击datatables选中一行，单击delete按钮，弹出警告框，提示要不要删除所选内容。当没有选中任何内容时，单击delete按钮，不会弹出警告框，也不会删除内容。3、编码：Attributes//名称1234567891
8、0111213141516171819202122232425262728293031/
