本文實例講述了jQuery+json實現動態創建復雜表格table的方法。分享給大家供大家參考,具體如下:
function SetSubTable() { var obj = jQuery.parseJSON($("#SubJsonStrValue").val()); window.ALLPARAMTERS = obj; var row_str = ""; var span_num = 1 for (var i = 0; i < obj.length; i++) { if (obj[i].ParamNames.length > 0) { row_str += '<tr><td rowspan="' + obj[i].ParamNames.length + '"><input type="checkbox" name="_'+obj[i].Id+'" />' + obj[i].Name + '</td>'; for (var j = 0; j < obj[i].ParamNames.length; j++) { if (j != 0) { row_str += "<tr>"; } row_str += '<td><input type="checkbox" name="p_'+obj[i].ParamNames[j].Id+'_'+obj[i].Id+'" />' + obj[i].ParamNames[j].Name + '</td><td>'; for (var k = 0; k < obj[i].ParamNames[j].ListItems.length; k++) { row_str += obj[i].ParamNames[j].ListItems[k].Name+"|"; } row_str = row_str.substring(0, row_str.length - 2); row_str += "</td><td>"; if (obj[i].ParamNames[j].CanMultiSelecte) { row_str += "多選"; } else { row_str += "單選"; } row_str += "</td></tr>"; } } } $("#sub_table_header").after(row_str); }
PS:關於json操作,這裡再為大家推薦幾款比較實用的json在線工具供大家參考使用:
在線JSON代碼檢驗、檢驗、美化、格式化工具:
http://tools.jb51.net/code/json
JSON在線格式化工具:
http://tools.jb51.net/code/jsonformat
在線XML/JSON互相轉換工具:
http://tools.jb51.net/code/xmljson
json代碼在線格式化/美化/壓縮/編輯/轉換工具:
http://tools.jb51.net/code/jsoncodeformat
在線json壓縮/轉義工具:
http://tools.jb51.net/code/json_yasuo_trans
C語言風格/HTML/CSS/json代碼格式化美化工具:
http://tools.jb51.net/code/ccode_html_css_json
更多關於jQuery相關內容感興趣的讀者可查看本站專題:《jQuery表單操作總結》、《jQuery常用插件及用法總結》、《jquery中Ajax用法總結》、《jQuery表格(table)操作技巧匯總》、《jQuery拖拽特效與技巧總結》、《jQuery擴展技巧總結》、《jQuery常見經典特效匯總》、《jQuery動畫與特效用法總結》及《jquery選擇器用法總結》
希望本文所述對大家jQuery程序設計有所幫助。