Yuvalanmış bir HTML tablosundaki Sütunu Gizle

Question

Sayfa jQuery kullanılarak kimlik etiketiyle yüklendiğinde birkaç sütunu gizlemeye çalışıyorum. Ancak çalışmıyor. Sorun ne olabilir? Ayrıca, ID etiketiyle sütunu tanımlamaktan ve aynı zamanda işe yaramayan Sınıfı kullanmaya da geçmeyi denedim. Lütfen yardım et. Aşağıdaki HTML kodunu ve jQuery'ye bakın.

HTML Kodu:

<table id="myTable" border="1"> 
<thead> 
<tr> 
<th colspan="3">Produce Funnel </th> 
</tr> 
<tr> 
<th class="header-0"></th> 
<th colspan='1' class="header-1">2015 
<img src="http://t1.gstatic.com/images?q=tbn:1PS9x2Ho4LHpaM:http://www.unesco.org/ulis/imag/plus.png" /> 
</th> 
<th colspan='1' class="header-2">2016 
<img src="http://t1.gstatic.com/images?q=tbn:1PS9x2Ho4LHpaM:http://www.unesco.org/ulis/imag/minus.png" /> 
</th> 
</thead> 
<tbody> 
<tr> 
<td> 
<table id="table0"> 
<tr> 
<th>Index</th> 
<th>Produce</th> 
</tr> 
<tr> 
<td>1</td> 
<td nowrap>Purchased</td> 
</tr> 
<tr> 
<td>2</td> 
<td nowrap>Returned</td> 
</tr> 
<tr> 
<td>3</td> 
<td nowrap>Perished</td> 
</tr> 
<tr> 
<td><B>4</B></td> 
<td nowrap><B>Sold</B></td> 
</tr> 
</table> 
</td> 
<td> 
<table id='table1'> 
<tr> 
<th id='YR2015'>Jan</th> 
<th id='YR2015'>Feb</th> 
<th id='YR2015'>Mar</th> 
<th nowrap id="YR2015T">2015 YTD Total</th> 
</tr> 
<tr> 
<td id='YR2015' class="YR2015A">218,672</td> 
<td id='YR2015' class="YR2015A">245,120</td> 
<td id='YR2015' class="YR2015A">203,017</td> 
<td id="YR2015T" class="TBL1TOTA"><B>$1,648,076</B></td> 
</tr> 
<tr> 
<td id='YR2015' class="YR2015B">32,682</td> 
<td id='YR2015' class="YR2015B">37,971</td> 
<td id='YR2015' class="YR2015B">33,209</td> 
<td id="YR2015T" class="TBL1TOTB"><B>$251,172</B></td> 
</tr> 
<tr> 
<td id='YR2015' class="YR2015C">8,976</td> 
<td id='YR2015' class="YR2015C">9,162</td> 
<td id='YR2015' class="YR2015C">6,762</td> 
<td id="YR2015T" class="TBL1TOTC"><B>$61,635</B></td> 
</tr> 
<tr> 
<td id='YR2015' class="YR2015D"><B>177,012</B></td> 
<td id='YR2015' class="YR2015D"><B>197,986</B></td> 
<td id='YR2015' class="YR2015D"><B>163,045</B></td> 
<td id="YR2015T" class="TBL1TOTD"><B>$1,335,268</B></td> 
</tr> 
</table> 
</td> 
<td> 
<table id='table2'> 
<tr> 
<th id="YR2016">Jan</th> 
<th id="YR2016">Feb</th> 
<th id="YR2016">Mar</th> 
<th nowrap id="YR2016T">2016 YTD Total</th> 
</tr> 
<tr> 
<td id="YR2016" class="YR2016A">133,794</td> 
<td id="YR2016" class="YR2016A">160,256</td> 
<td id="YR2016" class="YR2016A">140,998</td> 
<td id="YR2016T" class="TBL2TOTA"><B>$435,049</B></td> 
</tr> 
<tr> 
<td id="YR2016" class="YR2016B">16,366</td> 
<td id="YR2016" class="YR2016B">20,379</td> 
<td id="YR2016" class="YR2016B">12,088</td> 
<td id="YR2016T" class="TBL2TOTB"><B>$48,834</B></td> 
</tr> 
<tr> 
<td id="YR2016" class="YR2016C">4,942</td> 
<td id="YR2016" class="YR2016C">6,348</td> 
<td id="YR2016" class="YR2016C">8,645</td> 
<td id="YR2016T" class="TBL2TOTC"><B>$19,936</B></td> 
</tr> 
<tr> 
<td id="YR2016" class="YR2016D"><B>112,485</B></td> 
<td id="YR2016" class="YR2016D"><B>133,527</B></td> 
<td id="YR2016" class="YR2016D"><B>120,264</B></td> 
<td id="YR2016T" class="TBL2TOTD"><B>$366,277</B></td> 
</tr> 
</table> 
</td> 
</tr> 
</tbody> 
</table> 

jQuery kodu:

$(document).ready(function(){ 
     $('#table1 #YR2015').hide(); 

}); 

Answer 1

Öncelikle, birçok yerde aynı kimliği kullanamaz. Kimlik, belirli bir öğeye başvurmanın benzersiz bir yoludur. Zaten kimliklerin kullanımını kazıp sınıflara değiştirirdim.

şu çalışmalıdır:

$(document).ready(function(){ 
    $('.column-hide').hide(); 
}); 

HTML:

<table> 
    <tr> 
     <td>Column 1</td> 
     <td> 
      <table> 
       <tr> 
        <td>Nested Table Column 1</td> 
        <td class="column-hide">Nested Table Column 2</td> 
       </tr> 
       <tr> 
        <td>Nested Table Column 1</td> 
        <td class="column-hide">Nested Table Column 2</td> 
       </tr> 
      </table> 
     </td> 
    </tr> 
    <tr> 
     <td>Column 1</td> 
     <td>Column 2</td> 
    </tr> 
</table> 

Umarım bu yardımcı olur.