jQuery遍历Table tr td td中包含标签

转自:https://www.cnblogs.com/laoji1109/archive/2014/05/22/3746710.html

复制代码
 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="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="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="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="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="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="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="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="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="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="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="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="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="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="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="3" id="rptModule_ctl13_txtCount"
211                         style="width: 60px;" />
212                 </td>
213             </tr>
214         </table>
215     </div>
216     <br />
217     <a href="javascript:shengchen();">生成</a>
218     <br />
219     <br />
220     <input name="tt" id="txtContent" type="text" style="width: 977px;" />
221     </form>
222 </body>
223 </html>
复制代码

猜你喜欢

转载自www.cnblogs.com/sharpest/p/11267866.html