In diesem Artikel wird hauptsächlich die Funktion von jQuery Ajax zum dynamischen Generieren von Tabellen vorgestellt und die relevanten Betriebstechniken von jQuery zum dynamischen Erstellen von Tabellen basierend auf spezifischen Beispielen analysiert es kann jedem helfen.
$(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 class='tab-list' width='99%'>"; tableStr = tableStr + "<tr class='list-header'>" +"<td width='5%'>序号</td>" +"<td width='5%'><input id='checkAll' name='checkAll' type='checkbox' /></td>" +"<td width='30%'>用户姓名</td>" +"<td width='20%'>工号</td>" +"<td width='20%'>职位</td>" +"<td width='20%'>创建时间</td>" +"</tr>"; var len = data.length; for ( var i = 0; i < len; i++) { tableStr = tableStr + "<tr>" +"<td>"+ (i+1) + "</td>" +"<td><input class='check' id='checkOne' name='checkOne' 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 style='text-align: center'>" +"<td colspan='6'><font color='#cd0a0a'>"+ 暂无记录 + "</font></td>" +"</tr>"; } tableStr = tableStr + "</table>"; //添加到p中 $("#tableAjax").html(tableStr); }
Verwandte Empfehlungen:
Beispielanalyse der dynamischen Generierung von Objekten durch PHP basierend auf String-Klassennamen
Dynamische Generierung von HTML-Formularen Beispiel für den Code der asp.net-Methode
js generiert dynamisch HTML-Beispiele für Escapezeichen, die Ereignisparameter auslösen
Das obige ist der detaillierte Inhalt vonTeilen von Beispielen für die dynamisch generierte Ajax-Tabellenfunktion von jQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!