无法在jquery

时间:2016-02-14 06:51:36

标签: javascript jquery html

我目前在使用 jquery 在表格中选择表时遇到问题我想要的是选择表格中的第二个表格,如下面的 HTML 代码中所示。我尝试过以下 jquery 代码,但是当我使用它时,我将第一个tr添加到style="display:none;",因为我在下面写下来显示它选择的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>
                        &nbsp;
                    </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>

1 个答案:

答案 0 :(得分:1)

由于您要定位td table td,因此您需要在table内指定table,如下所示:

$("table table td:contains('NIL')").closest("tr").hide();

或准确tabletd内作为:

$("table td table td:contains('NIL')").closest("tr").hide();

否则您的条件将始终在第一个实例时满足,并且它将隐藏根tr,因为NIL中的table位于td

  

做笔记我不明白为什么你在第一个display:none;添加了tr,我已将其删除。

<强> Sinppet

 $("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>
      &nbsp;
    </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>