素材牛

动态加载数据表格插件ZBTable

 所属分类:网页特效-图表/统计/地图

 浏览:21次  下载:0次  评论:0次  发布时间:2018-12-05
动态加载数据表格插件ZBTable兼容IE8
积分说明:注册即送5牛币,每天签到可获得5牛币,第三方账号登陆、注册直接赠送20牛币!    我要充值   更多积分说明»
素材描述:能够根据后台传来的JSON数据动态创建的基本功能的JQuery表格插件

插件说明

evenRowClassoddRowClasscurRowClass为样式,可自定义;

overflowHeight参数为表格tbody出现滚动条的高度;

titles参数里 title为表头文字描述、keyName为JSON格式数据中的key、checkBox为展示为复选框、width可自定义宽度;

data参数绑定数据;

插件使用的demo: 

$('#test').ZBTable({
     //evenRowClass:'zbt-evenRow',//表格偶数行样式
     //oddRowClass:'zbt-oddRow',//表格奇数行样式
     //curRowClass:'zbt-curRow',//表格hover样式
     //overflowHeight: "260px",//出现滚动条的高度
     titles:[{
           title: "id",
           keyName: "id",
           width: 40,
           checkBox: true
     },
     {
           title:"姓名",
           keyName:"name"
     },{
           title:"年龄",
           keyName:"age",
           width: 60
     },{
           title:"身高",
           keyName:"height"
     },{
           title:"体重",
           keyName:"weight"
     },{
           title:"性别",
           keyName:"sex"
     }],
     data: testData
});

此插件是本人第一个发布的插件,也是第一次编写的JQuery插件。设置为需要jq币是为了能够下载更多的其他插件进行观摩、学习和改造,再发不出来。小小的一个币希望菜鸟本人帮助到的你们能够理解和支持。在此之后的插件将会免费开源。

下一个版本的table插件将会添加分页功能,并提供获取表格里的值的外部调用方法,并将免费开源,Thanks。

文件目录结构
  • css
    • ┝ jquer.zbtable.css
  • ┝ index.html
  • js
    • ┝ jquery.min.js
    • ┝ jquery.zbtable.js
  • json
    • ┝ testjson.js

讨论这个项目(0)回答他人问题或分享插件使用方法奖励牛币

 文明上网,理性发言!   😉 阿里云幸运券,戳我领取
我的牛币余额:0 已下载次数:0
所需牛币:5 开始下载

牛币获取:可通过签到、评论、充值、发布素材获得 » 牛币充值

会员账号
会员密码
安全验证