首页 > 代码库 > jQuery遍历Table tr td td中包含标签
jQuery遍历Table tr td td中包含标签
1 function shengchen() { 2 var arrTR = $("#tbModule").children(); 3 var Context=""; 4 $("#tbModule").find("tr").each(function () { 5 var arrtd = $(this).children(); 6 tdContext = $.trim(arrtd.eq(0).text()); 7 tdContext += ":" + arrtd.eq(2).find("input").val() + ";"; 8 Context += tdContext; 9 }) 10 Context= Context.substring(Context.indexOf(";")+1); 11 $("#txtContent").val(Context); 12 }
我这里是通过点击 来获取 table中的td的数据，其中一个td包含一个input标签
通过
$("#tbModule").find("tr").each(function () {})
来获回去所有行的对象，通过
$(this).children(); 来获取行内所有的td，通过
arrtd.eq(0)来获取某个制定的td，这里你也可以用循环来获取数据，注释的部分是获取td中标签的值
1 for (var k = 0; k < arrtd.length; k++) { 2 var con = arrtd.eq(k).text(); 3 //var con = arrtd.eq(2).find("input").val(); 4 }
全部代码
1 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="BianLi.aspx.cs" Inherits="jQueryDemoWeb.BianLi" %> 2 3 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 4 <html xmlns="http://www.w3.org/1999/xhtml"> 5 <head runat="server"> 6 <title></title> 7 <script src=http://www.mamicode.com/"Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> 8 <script> 9 function shengchen() { 10 var arrTR = $("#tbModule").children(); 11 var Context = ""; 12 $("#tbModule").find("tr").each(function () { 13 var arrtd = $(this).children(); 14 tdContext = $.trim(arrtd.eq(0).text()); 15 tdContext += ":" + arrtd.eq(2).find("input").val() + ";"; 16 Context += tdContext; 17 18 // for (var k = 0; k < arrtd.length; k++) { 19 // var con = arrtd.eq(k).text(); 20 // //var con = arrtd.eq(2).find("input").val(); 21 // } 22 23 }) 24 Context = Context.substring(Context.indexOf(";") + 1); 25 $("#txtContent").val(Context); 26 } 27 28 </script> 29 </head> 30 <body> 31 <form id="form1" runat="server"> 32 <div> 33 <table id="tbModule" width="100%" cellpadding="0" cellspacing="0" style="border-right: 1px solid #D2D2D2; 34 border-left: 1px solid #D2D2D2; border-bottom: 1px solid #D2D2D2;"> 35 <tr> 36 <td class="tb_d1" style="width: 60px;"> 37 编号 38 </td> 39 <td class="tb_d1" style="width: 60px;"> 40 名称 41 </td> 42 <td class="tb_d2" style="width: 80px;"> 43 终端数量 44 </td> 45 </tr> 46 <tr id=‘1‘> 47 <td id=‘dt11‘ class="tb_d1" style="width: 60px;"> 48 1 49 </td> 50 <td id="dt21" class="tb_d1" style="width: 60px;"> 51 前台收银 52 </td> 53 <td class="tb_d2" style="width: 80px;"> 54 <input name="rptModule$ctl00$txtCount" type="text" value=http://www.mamicode.com/"3" id="rptModule_ctl00_txtCount" 55 style="width: 60px;" /> 56 </td> 57 </tr> 58 <tr id=‘2‘> 59 <td id=‘dt12‘ class="tb_d1" style="width: 60px;"> 60 2 61 </td> 62 <td id="dt22" class="tb_d1" style="width: 60px;"> 63 打印服务器 64 </td> 65 <td class="tb_d2" style="width: 80px;"> 66 <input name="rptModule$ctl01$txtCount" type="text" value=http://www.mamicode.com/"3" id="rptModule_ctl01_txtCount" 67 style="width: 60px;" /> 68 </td> 69 </tr> 70 <tr id=‘3‘> 71 <td id=‘dt13‘ class="tb_d1" style="width: 60px;"> 72 3 73 </td> 74 <td id="dt23" class="tb_d1" style="width: 60px;"> 75 无线服务器 76 </td> 77 <td class="tb_d2" style="width: 80px;"> 78 <input name="rptModule$ctl02$txtCount" type="text" value=http://www.mamicode.com/"3" id="rptModule_ctl02_txtCount" 79 style="width: 60px;" /> 80 </td> 81 </tr> 82 <tr id=‘4‘> 83 <td id=‘dt14‘ class="tb_d1" style="width: 60px;"> 84 4 85 </td> 86 <td id="dt24" class="tb_d1" style="width: 60px;"> 87 会员管理 88 </td> 89 <td class="tb_d2" style="width: 80px;"> 90 <input name="rptModule$ctl03$txtCount" type="text" value=http://www.mamicode.com/"3" id="rptModule_ctl03_txtCount" 91 style="width: 60px;" /> 92 </td> 93 </tr> 94 <tr id=‘5‘> 95 <td id=‘dt15‘ class="tb_d1" style="width: 60px;"> 96 5 97 </td> 98 <td id="dt25" class="tb_d1" style="width: 60px;"> 99 库存管理 100 </td> 101 <td class="tb_d2" style="width: 80px;"> 102 <input name="rptModule$ctl04$txtCount" type="text" value=http://www.mamicode.com/"3" id="rptModule_ctl04_txtCount" 103 style="width: 60px;" /> 104 </td> 105 </tr> 106 <tr id=‘6‘> 107 <td id=‘dt16‘ class="tb_d1" style="width: 60px;"> 108 6 109 </td> 110 <td id="dt26" class="tb_d1" style="width: 60px;"> 111 经理查询 112 </td> 113 <td class="tb_d2" style="width: 80px;"> 114 <input name="rptModule$ctl05$txtCount" type="text" value=http://www.mamicode.com/"3" id="rptModule_ctl05_txtCount" 115 style="width: 60px;" /> 116 </td> 117 </tr> 118 <tr id=‘7‘> 119 <td id=‘dt17‘ class="tb_d1" style="width: 60px;"> 120 7 121 </td> 122 <td id="dt27" class="tb_d1" style="width: 60px;"> 123 数据维护 124 </td> 125 <td class="tb_d2" style="width: 80px;"> 126 <input name="rptModule$ctl06$txtCount" type="text" value=http://www.mamicode.com/"3" id="rptModule_ctl06_txtCount" 127 style="width: 60px;" /> 128 </td> 129 </tr> 130 <tr id=‘10‘> 131 <td id=‘dt110‘ class="tb_d1" style="width: 60px;"> 132 10 133 </td> 134 <td id="dt210" class="tb_d1" style="width: 60px;"> 135 成本管理 136 </td> 137 <td class="tb_d2" style="width: 80px;"> 138 <input name="rptModule$ctl07$txtCount" type="text" value=http://www.mamicode.com/"3" id="rptModule_ctl07_txtCount" 139 style="width: 60px;" /> 140 </td> 141 </tr> 142 <tr id=‘17‘> 143 <td id=‘dt117‘ class="tb_d1" style="width: 60px;"> 144 17 145 </td> 146 <td id="dt217" class="tb_d1" style="width: 60px;"> 147 预订平台 148 </td> 149 <td class="tb_d2" style="width: 80px;"> 150 <input name="rptModule$ctl08$txtCount" type="text" value=http://www.mamicode.com/"3" id="rptModule_ctl08_txtCount" 151 style="width: 60px;" /> 152 </td> 153 </tr> 154 <tr id=‘20‘> 155 <td id=‘dt120‘ class="tb_d1" style="width: 60px;"> 156 20 157 </td> 158 <td id="dt220" class="tb_d1" style="width: 60px;"> 159 快餐收银 160 </td> 161 <td class="tb_d2" style="width: 80px;"> 162 <input name="rptModule$ctl09$txtCount" type="text" value=http://www.mamicode.com/"3" id="rptModule_ctl09_txtCount" 163 style="width: 60px;" /> 164 </td> 165 </tr> 166 <tr id=‘21‘> 167 <td id=‘dt121‘ class="tb_d1" style="width: 60px;"> 168 21 169 </td> 170 <td id="dt221" class="tb_d1" style="width: 60px;"> 171 财务管理 172 </td> 173 <td class="tb_d2" style="width: 80px;"> 174 <input name="rptModule$ctl10$txtCount" type="text" value=http://www.mamicode.com/"3" id="rptModule_ctl10_txtCount" 175 style="width: 60px;" /> 176 </td> 177 </tr> 178 <tr id=‘22‘> 179 <td id=‘dt122‘ class="tb_d1" style="width: 60px;"> 180 22 181 </td> 182 <td id="dt222" class="tb_d1" style="width: 60px;"> 183 营销管理 184 </td> 185 <td class="tb_d2" style="width: 80px;"> 186 <input name="rptModule$ctl11$txtCount" type="text" value=http://www.mamicode.com/"3" id="rptModule_ctl11_txtCount" 187 style="width: 60px;" /> 188 </td> 189 </tr> 190 <tr id=‘23‘> 191 <td id=‘dt123‘ class="tb_d1" style="width: 60px;"> 192 23 193 </td> 194 <td id="dt223" class="tb_d1" style="width: 60px;"> 195 厨房监控 196 </td> 197 <td class="tb_d2" style="width: 80px;"> 198 <input name="rptModule$ctl12$txtCount" type="text" value=http://www.mamicode.com/"3" id="rptModule_ctl12_txtCount" 199 style="width: 60px;" /> 200 </td> 201 </tr> 202 <tr id=‘24‘> 203 <td id=‘dt124‘ class="tb_d1" style="width: 60px;"> 204 24 205 </td> 206 <td id="dt224" class="tb_d1" style="width: 60px;"> 207 总部管理 208 </td> 209 <td class="tb_d2" style="width: 80px;"> 210 <input name="rptModule$ctl13$txtCount" type="text" value=http://www.mamicode.com/"3" id="rptModule_ctl13_txtCount" 211 style="width: 60px;" /> 212 </td> 213 </tr> 214 </table> 215 </div> 216 <br /> 217 <a href=http://www.mamicode.com/"javascript:shengchen();">生成</a> 218 <br /> 219 <br /> 220 <input name="tt" id="txtContent" type="text" style="width: 977px;" /> 221 </form> 222 </body> 223 </html>
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。