首页 > 代码库 > jQuery遍历Table tr td td中包含标签
jQuery遍历Table tr td td中包含标签
function shengchen() {
var arrTR = $("#tbModule").children();
var Context="";
$("#tbModule").find("tr").each(function () {
var arrtd = $(this).children();
tdContext = $.trim(arrtd.eq(0).text());
tdContext += ":" + arrtd.eq(2).find("input").val() + ";";
Context += tdContext;
})
Context= Context.substring(Context.indexOf(";")+1);
$("#txtContent").val(Context);
}
我这里是通过点击 来获取 table中的td的数据，其中一个td包含一个input标签
通过
$("#tbModule").find("tr").each(function () {})
来获回去所有行的对象，通过
$(this).children();
来获取行内所有的td，通过
arrtd.eq(0)
来获取某个制定的td，这里你也可以用循环来获取数据，注释的部分是获取td中标签的值
for (var k = 0; k < arrtd.length; k++) {
var con = arrtd.eq(k).text();
//var con = arrtd.eq(2).find("input").val();
}
全部代码
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="BianLi.aspx.cs" Inherits="jQueryDemoWeb.BianLi" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="http://www.mamicode.com/Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script>
function shengchen() {
var arrTR = $("#tbModule").children();
var Context = "";
$("#tbModule").find("tr").each(function () {
var arrtd = $(this).children();
tdContext = $.trim(arrtd.eq(0).text());
tdContext += ":" + arrtd.eq(2).find("input").val() + ";";
Context += tdContext;
// for (var k = 0; k < arrtd.length; k++) {
// var con = arrtd.eq(k).text();
// //var con = arrtd.eq(2).find("input").val();
// }
})
Context = Context.substring(Context.indexOf(";") + 1);
$("#txtContent").val(Context);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<table id="tbModule" width="100%" cellpadding="0" cellspacing="0" style="border-right: 1px solid #D2D2D2;
border-left: 1px solid #D2D2D2; border-bottom: 1px solid #D2D2D2;">
<tr>
<td class="tb_d1" style="width: 60px;">
编号
</td>
<td class="tb_d1" style="width: 60px;">
名称
</td>
<td class="tb_d2" style="width: 80px;">
终端数量
</td>
</tr>
<tr id=‘1‘>
<td id=‘dt11‘ class="tb_d1" style="width: 60px;">
1
</td>
<td id="dt21" class="tb_d1" style="width: 60px;">
前台收银
</td>
<td class="tb_d2" style="width: 80px;">
<input name="rptModule$ctl00$txtCount" type="text" value="http://www.mamicode.com/3" id="rptModule_ctl00_txtCount"
style="width: 60px;" />
</td>
</tr>
<tr id=‘2‘>
<td id=‘dt12‘ class="tb_d1" style="width: 60px;">
2
</td>
<td id="dt22" class="tb_d1" style="width: 60px;">
打印服务器
</td>
<td class="tb_d2" style="width: 80px;">
<input name="rptModule$ctl01$txtCount" type="text" value="http://www.mamicode.com/3" id="rptModule_ctl01_txtCount"
style="width: 60px;" />
</td>
</tr>
<tr id=‘3‘>
<td id=‘dt13‘ class="tb_d1" style="width: 60px;">
3
</td>
<td id="dt23" class="tb_d1" style="width: 60px;">
无线服务器
</td>
<td class="tb_d2" style="width: 80px;">
<input name="rptModule$ctl02$txtCount" type="text" value="http://www.mamicode.com/3" id="rptModule_ctl02_txtCount"
style="width: 60px;" />
</td>
</tr>
<tr id=‘4‘>
<td id=‘dt14‘ class="tb_d1" style="width: 60px;">
4
</td>
<td id="dt24" class="tb_d1" style="width: 60px;">
会员管理
</td>
<td class="tb_d2" style="width: 80px;">
<input name="rptModule$ctl03$txtCount" type="text" value="http://www.mamicode.com/3" id="rptModule_ctl03_txtCount"
style="width: 60px;" />
</td>
</tr>
<tr id=‘5‘>
<td id=‘dt15‘ class="tb_d1" style="width: 60px;">
5
</td>
<td id="dt25" class="tb_d1" style="width: 60px;">
库存管理
</td>
<td class="tb_d2" style="width: 80px;">
<input name="rptModule$ctl04$txtCount" type="text" value="http://www.mamicode.com/3" id="rptModule_ctl04_txtCount"
style="width: 60px;" />
</td>
</tr>
<tr id=‘6‘>
<td id=‘dt16‘ class="tb_d1" style="width: 60px;">
6
</td>
<td id="dt26" class="tb_d1" style="width: 60px;">
经理查询
</td>
<td class="tb_d2" style="width: 80px;">
<input name="rptModule$ctl05$txtCount" type="text" value="http://www.mamicode.com/3" id="rptModule_ctl05_txtCount"
style="width: 60px;" />
</td>
</tr>
<tr id=‘7‘>
<td id=‘dt17‘ class="tb_d1" style="width: 60px;">
7
</td>
<td id="dt27" class="tb_d1" style="width: 60px;">
数据维护
</td>
<td class="tb_d2" style="width: 80px;">
<input name="rptModule$ctl06$txtCount" type="text" value="http://www.mamicode.com/3" id="rptModule_ctl06_txtCount"
style="width: 60px;" />
</td>
</tr>
<tr id=‘10‘>
<td id=‘dt110‘ class="tb_d1" style="width: 60px;">
10
</td>
<td id="dt210" class="tb_d1" style="width: 60px;">
成本管理
</td>
<td class="tb_d2" style="width: 80px;">
<input name="rptModule$ctl07$txtCount" type="text" value="http://www.mamicode.com/3" id="rptModule_ctl07_txtCount"
style="width: 60px;" />
</td>
</tr>
<tr id=‘17‘>
<td id=‘dt117‘ class="tb_d1" style="width: 60px;">
17
</td>
<td id="dt217" class="tb_d1" style="width: 60px;">
预订平台
</td>
<td class="tb_d2" style="width: 80px;">
<input name="rptModule$ctl08$txtCount" type="text" value="http://www.mamicode.com/3" id="rptModule_ctl08_txtCount"
style="width: 60px;" />
</td>
</tr>
<tr id=‘20‘>
<td id=‘dt120‘ class="tb_d1" style="width: 60px;">
20
</td>
<td id="dt220" class="tb_d1" style="width: 60px;">
快餐收银
</td>
<td class="tb_d2" style="width: 80px;">
<input name="rptModule$ctl09$txtCount" type="text" value="http://www.mamicode.com/3" id="rptModule_ctl09_txtCount"
style="width: 60px;" />
</td>
</tr>
<tr id=‘21‘>
<td id=‘dt121‘ class="tb_d1" style="width: 60px;">
21
</td>
<td id="dt221" class="tb_d1" style="width: 60px;">
财务管理
</td>
<td class="tb_d2" style="width: 80px;">
<input name="rptModule$ctl10$txtCount" type="text" value="http://www.mamicode.com/3" id="rptModule_ctl10_txtCount"
style="width: 60px;" />
</td>
</tr>
<tr id=‘22‘>
<td id=‘dt122‘ class="tb_d1" style="width: 60px;">
22
</td>
<td id="dt222" class="tb_d1" style="width: 60px;">
营销管理
</td>
<td class="tb_d2" style="width: 80px;">
<input name="rptModule$ctl11$txtCount" type="text" value="http://www.mamicode.com/3" id="rptModule_ctl11_txtCount"
style="width: 60px;" />
</td>
</tr>
<tr id=‘23‘>
<td id=‘dt123‘ class="tb_d1" style="width: 60px;">
23
</td>
<td id="dt223" class="tb_d1" style="width: 60px;">
厨房监控
</td>
<td class="tb_d2" style="width: 80px;">
<input name="rptModule$ctl12$txtCount" type="text" value="http://www.mamicode.com/3" id="rptModule_ctl12_txtCount"
style="width: 60px;" />
</td>
</tr>
<tr id=‘24‘>
<td id=‘dt124‘ class="tb_d1" style="width: 60px;">
24
</td>
<td id="dt224" class="tb_d1" style="width: 60px;">
总部管理
</td>
<td class="tb_d2" style="width: 80px;">
<input name="rptModule$ctl13$txtCount" type="text" value="http://www.mamicode.com/3" id="rptModule_ctl13_txtCount"
style="width: 60px;" />
</td>
</tr>
</table>
</div>
<br />
<a href="javascript:shengchen();">生成</a>
<br />
<br />
<input name="tt" id="txtContent" type="text" style="width: 977px;" />
</form>
</body>
</html>
jQuery遍历Table tr td td中包含标签