jquery通过AJAX从后台获取信息并显示在表格上的实现类

在上篇文章给大家介绍了JQuery通过AJAX从后台获取信息显示在表格上并支持行选中，现在，抽个时间他们处理了一下，这样就不需要每次写代码了，可以节省大量的时间，具体请看下文：
具体代码如下：

//获取数据并显示数据表格function GetTableData（tableId,ChlickEvent） { var table = $（tableId）; var url=table.data（"url"）; $.ajax（{url: url,type: "post",dataType: "json", }） .done（function （json） {var fileds = new Array（）;table.children（"thead"）.children（"tr"）.children（"th"）.each（function （index, el） { var field = $（this）.data（"field"）; fileds[index] = field;}）;var tbody = "";$.each（json, function （index, el） { var tr = "<tr>"; $.each（fileds, function （i, el） {if （fileds[i]） { tr += "<td>" + formatJsonData（json[index][fileds[i]]） + "</td>";} }）; tr += "</tr>"; tbody += tr;}）;table.children（"tbody"）.append（tbody）;if （ChlickEvent） {//如果需要支持行选中事件 table.children（"tbody"）.addClass（"sel"）; table.children（"tbody.sel"）.children（"tr"）.click（function （event） {$（this）.siblings（"tr"）.removeClass（"active"）;//删除其他行的选中效果$（this）.addClass（"active"）;//增加选中效果ChlickEvent（$（this）.children（"td:eq（0）"）.text（））;//新增点击事件 }）;} }）.fail（function （） {alert（"Err"）; }）;}//格式化JSON数据，比如日期function formatJsonData（jsondata）{ if（jsondata==null）{return "无数据"; } else if（//Date（d+）/.exec（jsondata））{var date = new Date（parseInt（jsondata.replace（"/Date（", ""）.replace（"）/", ""）, 10））;return date.toLocaleString（）; } return jsondata;}

写的非常简单，功能也很少，但是我自己用暂时足够了。满足简单需求。
HTML代码必须以下格式，必须以POST方式获取JSON数据，获取地址写到data-url里，数据列名写到data-field里。
支持点击事件。
用法：

<table id="RoleGroupTable" class="table" data-url="@Url.Action（"GetRoleGroups", "Account"）"> <thead> <tr><th data-field="ID">ID</th><th data-field="Name">名称</th><th data-field="Remark">简介</th> </tr> </thead> <tbody></tbody></table><script> jQuery（document）.ready（function （$） { GetTableData（"#RoleGroupTable", function （id） {alert（id） }）; }）;</script>

以上代码简单易懂，jquery通过AJAX从后台获取信息并显示在表格上的实现类就这样完成了，希望大家喜欢。