ajax遍历生成table,jQuery ajax动态生成table功能示例

本文实例讲述了jQuery ajax动态生成table的方法。分享给大家供大家参考，具体如下：

$(function(){

ajaxT();

});

function ajaxT(){

$.ajax({

type:"POST",

dataType: "json",

url:"UserInfoServlet",

data:"doaction=userList",

success:function(data){

createShowingTable(data);

}

}

);

}

//动态的创建一个table

function createShowingTable(data) {

var tableStr = "

tableStr = tableStr

+ "

"

+"

序号"

+"

"

+"

用户姓名"

+"

工号"

+"

职位"

+"

创建时间"

+"

";

var len = data.length;

for ( var i = 0; i < len; i++) {

tableStr = tableStr + "

"

+"

"+ (i+1) + ""

+"

"

+"

"+ data[i].realName + ""

+ "

"+ data[i].userNo + ""

+ "

"+ data[i].position + ""

+"

"+data[i].regTime+""

+"

";

}

if(len==0){

tableStr = tableStr + "

"

+"

"+ 暂无记录 + ""

+"

";

}

tableStr = tableStr + "

";

//添加到div中

$("#tableAjax").html(tableStr);

}

更多关于jQuery相关内容感兴趣的读者可查看本站专题：《jquery中Ajax用法总结》、《jQuery表格(table)操作技巧汇总》、《jQuery操作json数据技巧汇总》、《jQuery form操作技巧汇总》、《jQuery常用插件及用法总结》、《jQuery扩展技巧总结》及《jquery选择器用法总结》

希望本文所述对大家jQuery程序设计有所帮助。

您可能感兴趣的文章:Jquery ajax请求导出Excel表格的实现代码

JQuery Ajax动态生成Table表格

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

bootstrap jquery dataTable 异步ajax刷新表格数据的实现方法

用Jquery实现可编辑表格并用AJAX提交到服务器修改数据

JQuery通过AJAX从后台获取信息显示在表格上并支持行选中

jQuery+Ajax实现表格数据不同列标题排序(为表格注入活力)

JQuery DataTable删除行后的页面更新利用Ajax解决

jQuery DataTables插件自定义Ajax分页实例解析

jQuery+ajax实现动态添加表格tr td功能示例