使用此代码:
var table1 = $('#TableA').find('td:eq(1)').text(); var table2 = $("#TableB tr:gt(0)"); table2.each(function (i) { var tds = $(this).children('td'); var type= +tds.eq(0).text(); var price = +tds.eq(1).text(); if (price == table1) { var myTable = table2.filter(function () { var tds = $(this).children('td'); }) myTable.add(this).hide() } })
我的Html页面结构
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<table id="TableA">
<tr>
<th>Type</th>
<th>Price</th>
<th>Quantity</th>
<th>Ref No</th>
</tr>
<tr>
<td>Mouse</td>
<td>50</td>
<td>6</td>
<td>#101255</td>
</tr>
<tr>
<td>Speaker</td>
<td>300</td>
<td>6</td>
<td>#21165</td>
</tr>
</table>
<table id="TableB">
<tr>
<th>Type</th>
<th>Price</th>
<th>Quantity</th>
<th>Ref No</th>
</tr>
<tr>
<td>Mouse</td>
<td>50</td>
<td>6</td>
<td>#101255</td>
</tr>
<tr>
<td>Speaker</td>
<td>300</td>
<td>6</td>
<td>#21165</td>
</tr>
<tr>
<td>Keyboard</td>
<td>150</td>
<td>7</td>
<td>#31234</td>
</tr>
</table>
</body>
</html>
“图像中的第二个表是表B”
我的表B由此改变: Before
对此:After
现在我的问题是,只隐藏了一行。仍然显示“扬声器”所在的行。我知道我必须使用一个循环,但我不知道在哪里实现循环以及如何。我是新手程序员,我知道我需要更多练习。请帮忙提前谢谢
答案 0 :(得分:0)
<script type="text/javascript">
$('body').click(function(e){
var table1_tr = $('#TableA').find('tr'); <!--get the rows of first table-->
var table2 = $("#TableB tr:gt(0)");
table1_tr.each(function(i,e){ <!-- loop through rows of first table -->
var table1 = $(e).find('td:eq(1)').text();
table2.each(function (i) {
var tds = $(this).children('td');
var type= +tds.eq(0).text();
var price = +tds.eq(1).text();
if (price == table1) {
var myTable = table2.filter(function () {
var tds = $(this).children('td');
})
myTable.add(this).hide()
}
});
})
});
</script>
您正在使用第二个表的所有行的price
文本检查第一个表的第一行中td
的文本
我修改了脚本以循环遍历第一个表的行,并使用第二个表的所有行检查它们 希望这有帮助