无法在 jquery 中选择表中的表
Unable to select table inside a table in jquery
我目前在使用jquery选择表内的表时遇到问题,我想要的是选择表中的第二个表,如下面的HTML代码所示。我已经尝试了以下jquery代码,但是当我使用它时,它会添加第一个带有style="display:none;"
tr
,因为我在下面写下它以显示它选择tr
,但我想选择第三个table tr
。任何人都可以帮我选择正确的table
.
这是我尝试过的:
<script>
$(document).ready(function () {
$("table td:contains('NIL')").closest("tr").hide();
});
</script>
<table width="79%" border="0" cellpadding="0" cellspacing="0" height="350">
<tr style="display:none;">
<td valign="top" width="1%" bgcolor=#FFFFFF>
</td>
<td valign="top" width="78%" bgcolor=#FFFFFF>
<center>
<br><b><u>COURSE PAGE - Winter Semester 2015~16</u></b><br /><br />
<table cellspacing='0' cellpadding='4' align='center' border='1' width='95%' style='border-collapse: collapse;' bordercolor='black'>
<tr align=center bgcolor=#5A768D>
<td width=80><font color=#FFFFFF>Course Owner</font></td>
<td width=70><font color=#FFFFFF>Course Code</font></td>
<td><font color=#FFFFFF>Course Title</font></td>
<td><font color=#FFFFFF>Course Type</font></td>
<td><font color=#FFFFFF>Faculty</font></td>
<td><font color=#FFFFFF>Class Nbr(s)</font></td>
<td><font color=#FFFFFF>Slot(s)</font></td>
</tr>
<tr bgcolor='#E1ECF2'>
<td width=80 align=center>SITE</td>
<td width=70 align=center>ITE302</td>
<td>Database Systems</td>
<td>Embedded Lab</td>
<td>11543 - SARAVANAKUMAR K - SITE</td>
<td>2039</td>
<td>L29+L30</td>
</tr>
</table><br>
<table cellspacing='0' cellpadding='4' width="95%" align='center' border='1' style='border-collapse: collapse;' bordercolor='black' height="61">
<tr>
<td bgcolor=#5A768D width="22%" height="30"><font color=#FFFFFF>Syllabus</font></td>
<form action='syllabus_file.asp' method='post'><td bgcolor='#EDEADE' width='75%' height='30'><input type='hidden' name='crscd' value='ITE302'><input type='hidden' name='crstp' value='ELA'><input type='hidden' name='version' value='1'><input type='submit' name='sybcmd' class='submit' value='Download'></td></form>
</tr>
<tr>
<td bgcolor=#5A768D width="22%" height="30" rowspan=5 valign=top>
<font color=#FFFFFF>Text/Reference Material</font>
</td>
<td bgcolor='#EDEADE' width="75%" height="30">
<a href='https://academics.vit.ac.in/faculty/Syllabus_Textbook/WINSEM2015-16_CP1673_TB01_DBMS_Lab_Manual.pdf' target='_blank'><font color=blue>DBMS_Lab_Manual.pdf</font></a>
</td>
</tr>
<tr>
<td bgcolor='#EDEADE' width="75%" height="30">
<a href='https://academics.vit.ac.in/faculty/Syllabus_Textbook/WINSEM2015-16_CP1673_TB02_Structured-Query-Language.pdf' target='_blank'><font color=blue>Structured-Query-Language.pdf</font></a>
</td>
</tr>
<tr>
<td bgcolor='#EDEADE' width="75%" height="30">
<a href='https://academics.vit.ac.in/faculty/Syllabus_Textbook/WINSEM2015-16_CP1673_TB03_students_manual.pdf' target='_blank'><font color=blue>students_manual.pdf</font></a>
</td>
</tr>
<tr>
<td bgcolor='#EDEADE' width="75%" height="30">
NIL
</td>
</tr>
<tr>
<td bgcolor='#EDEADE' width="75%" height="30">
NIL
</td>
</tr>
</table><br>
<table cellspacing='0' cellpadding='4' width="95%" align='center' border='1' style='border-collapse: collapse;' bordercolor='black' height="61">
<tr>
<td bgcolor=#5A768D width="22%" height="30" rowspan=5 valign=top>
<font color=#FFFFFF>Assignments</font>
</td>
<td bgcolor='#EDEADE' width="76%" height="30">
NIL
</td>
</tr>
<tr>
<td bgcolor='#EDEADE' width="76%" height="30">
NIL
</td>
</tr>
<tr>
<td bgcolor='#EDEADE' width="76%" height="30">
NIL
</td>
</tr>
<tr>
<td bgcolor='#EDEADE' width="76%" height="30">
NIL
</td>
</tr>
<tr>
<td bgcolor='#EDEADE' width="76%" height="30">
NIL
</td>
</tr>
</table><br>
由于您的目标是td
内部table
的td
,因此您需要在table
内部指定table
,如下所示:
$("table table td:contains('NIL')").closest("tr").hide();
或者准确地说,table
td
内部为:
$("table td table td:contains('NIL')").closest("tr").hide();
否则,您的条件将始终在第一个实例中满足,并且它将隐藏根tr
,因为table
内部有NIL
td
记下 - 我不明白为什么你在第一个
tr
上添加了display:none;
,我已经删除了它。
辛佩特
$("table table td:contains('NIL')").closest("tr").hide();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table width="79%" border="0" cellpadding="0" cellspacing="0" height="350">
<tr>
<td valign="top" width="1%" bgcolor=#FFFFFF>
</td>
<td valign="top" width="78%" bgcolor=#FFFFFF>
<center>
<br><b><u>COURSE PAGE - Winter Semester 2015~16</u></b>
<br />
<br />
<table cellspacing='0' cellpadding='4' align='center' border='1' width='95%' style='border-collapse: collapse;' bordercolor='black'>
<tr align=center bgcolor=#5A768D>
<td width=80><font color=#FFFFFF>Course Owner</font>
</td>
<td width=70><font color=#FFFFFF>Course Code</font>
</td>
<td><font color=#FFFFFF>Course Title</font>
</td>
<td><font color=#FFFFFF>Course Type</font>
</td>
<td><font color=#FFFFFF>Faculty</font>
</td>
<td><font color=#FFFFFF>Class Nbr(s)</font>
</td>
<td><font color=#FFFFFF>Slot(s)</font>
</td>
</tr>
<tr bgcolor='#E1ECF2'>
<td width=80 align=center>SITE</td>
<td width=70 align=center>ITE302</td>
<td>Database Systems</td>
<td>Embedded Lab</td>
<td>11543 - SARAVANAKUMAR K - SITE</td>
<td>2039</td>
<td>L29+L30</td>
</tr>
</table>
<br>
<table cellspacing='0' cellpadding='4' width="95%" align='center' border='1' style='border-collapse: collapse;' bordercolor='black' height="61">
<tr>
<td bgcolor=#5A768D width="22%" height="30"><font color=#FFFFFF>Syllabus</font>
</td>
<form action='syllabus_file.asp' method='post'>
<td bgcolor='#EDEADE' width='75%' height='30'>
<input type='hidden' name='crscd' value='ITE302'>
<input type='hidden' name='crstp' value='ELA'>
<input type='hidden' name='version' value='1'>
<input type='submit' name='sybcmd' class='submit' value='Download'>
</td>
</form>
</tr>
<tr>
<td bgcolor=#5A768D width="22%" height="30" rowspan=5 valign=top>
<font color=#FFFFFF>Text/Reference Material</font>
</td>
<td bgcolor='#EDEADE' width="75%" height="30">
<a href='https://academics.vit.ac.in/faculty/Syllabus_Textbook/WINSEM2015-16_CP1673_TB01_DBMS_Lab_Manual.pdf' target='_blank'><font color=blue>DBMS_Lab_Manual.pdf</font></a>
</td>
</tr>
<tr>
<td bgcolor='#EDEADE' width="75%" height="30">
<a href='https://academics.vit.ac.in/faculty/Syllabus_Textbook/WINSEM2015-16_CP1673_TB02_Structured-Query-Language.pdf' target='_blank'><font color=blue>Structured-Query-Language.pdf</font></a>
</td>
</tr>
<tr>
<td bgcolor='#EDEADE' width="75%" height="30">
<a href='https://academics.vit.ac.in/faculty/Syllabus_Textbook/WINSEM2015-16_CP1673_TB03_students_manual.pdf' target='_blank'><font color=blue>students_manual.pdf</font></a>
</td>
</tr>
<tr>
<td bgcolor='#EDEADE' width="75%" height="30">
NIL
</td>
</tr>
<tr>
<td bgcolor='#EDEADE' width="75%" height="30">
NIL
</td>
</tr>
</table>
<br>
<table cellspacing='0' cellpadding='4' width="95%" align='center' border='1' style='border-collapse: collapse;' bordercolor='black' height="61">
<tr>
<td bgcolor=#5A768D width="22%" height="30" rowspan=5 valign=top>
<font color=#FFFFFF>Assignments</font>
</td>
<td bgcolor='#EDEADE' width="76%" height="30">
NIL
</td>
</tr>
<tr>
<td bgcolor='#EDEADE' width="76%" height="30">
NIL
</td>
</tr>
<tr>
<td bgcolor='#EDEADE' width="76%" height="30">
NIL
</td>
</tr>
<tr>
<td bgcolor='#EDEADE' width="76%" height="30">
NIL
</td>
</tr>
<tr>
<td bgcolor='#EDEADE' width="76%" height="30">
NIL
</td>
</tr>
</table>
<br>
相关文章:
- 根据复选框选择 jQuery 更新文本框
- 不能同时通过类和数字 ID 选择 jquery 元素
- 如何在jQuery.load(html)之后选择jQuery.Treeview中的当前元素
- 限制用户选择jQuery日期选择器以外的日期
- 如何使用“属性以选择器开头”中的 ID 变量来选择 jQuery 中的元素
- 一个变量,多个复选框选择/取消选择 jQuery
- 动态添加和删除项目以选择 jquery
- 选择 jQuery 的第一个元素
- 使用 javascript 选择 jQuery CSS 类型下拉列表
- 从选择“jQuery”中删除所有选项,但只删除一个选项
- 添加将列表项添加到<选择> jQuery 时要捕获的事件
- 取消选择 jquery 选择器
- 按 id 选择 jQuery 自动完成值
- 选择jquery的问题
- 按数据属性选择(JQuery)
- 如何在动态创建表后保留下拉选择-Jquery
- 如果选择JQuery幻灯片,则不显示动画
- 已选择jquery上的更新选项
- 如何在选择jQuery选项卡时正确更新URL哈希
- 在选择JQUERY时填充输入