首先非常感谢网友zoeDylan的无私分享,此作品是他分享到JquerySchool网站上的第二款原创jquery插件,实现了动态数据表格功能,jquery插件名称为zoeDylan.DataTable-1.0.0,数据表格的标题title和列表项item都是由数组动态来配置,jquery插件可灵活配置7个参数,zoeDylan.DataTable-1.0.0.js文件里面的功能注释也写得非常详细,对网友们的学习是很有帮助的,虽然样式不太好看,大家可以自己写,好好利用哦。。。
页面初始化jquery代码如下:
var title = new Array('姓名', '性别', '年龄');
var item = new Array(
new Array('张3', '男', '19'),
new Array('张3', '男', '19'),
new Array('张3', '男', '19'),
new Array('f', '男', '19'),
new Array('d', '男', '19'),
new Array('s', '男', '19'),
new Array('g', '男', '19'),
new Array('张3', '男', '19'),
new Array('张3', '男', '19'),
new Array('10', '男', '19'),
new Array('张3', '男', '19'),
new Array('r', '男', '19'),
new Array('张3', '男', '19'),
new Array('张3', '男', '19'),
new Array('d', '男', '19'),
new Array('张3', '男', '19'),
new Array('张3', '男', '19'),
new Array('ds张3', '男', '19'),
new Array('张3', '男', '19'),
new Array('20', '男', '19'),
new Array('sdf张3', '男', '19'),
new Array('张3', '男', '19'),
new Array('sd张3', '男', '19')
);
$(function () {
$('#table').zoeDylan_DataTable({
title: title,
item: item,
width: 500,
height: 200,
itemNum:10
});
});
效果如下:
如果您觉得本作品对您的学习有所帮助:
关键字:
网友zoeDylan 数据分页 DataTable 分页插件 jquery分页插件 json数据解析