本文实例讲述了jQuery ajax动态生成table的方法。分享给大家供大家参考,具体如下:
$(function(){ ajaxT(); }); function ajaxT(){ $.ajax({ type:"POST", dataType: "json", url:"<%=basePath%>UserInfoServlet", data:"doaction=userList", success:function(data){ createShowingTable(data); } } ); } //动态的创建一个table function createShowingTable(data) { var tableStr = "<table>"; tableStr = tableStr + "<tr>" +"<td>序号</td>" +"<td><input type='checkbox' /></td>" +"<td>用户姓名</td>" +"<td>工号</td>" +"<td>职位</td>" +"<td>创建时间</td>" +"</tr>"; var len = data.length; for ( var i = 0; i < len; i++) { tableStr = tableStr + "<tr>" +"<td>"+ (i+1) + "</td>" +"<td><input type='checkbox' value='"+data[i].key+"' /></td>" +"<td>"+ data[i].realName + "</td>" + "<td>"+ data[i].userNo + "</td>" + "<td>"+ data[i].position + "</td>" +"<td>"+data[i].regTime+"</td>" +"</tr>"; } if(len==0){ tableStr = tableStr + "<tr>" +"<td colspan='6'><font color='#cd0a0a'>"+ 暂无记录 + "</font></td>" +"</tr>"; } tableStr = tableStr + "</table>"; //添加到div中 $("#tableAjax").html(tableStr); }