javascript - 跳过表中的列 javascript

Question

美好的一天，

我试图跳过表上的一些列，以免将其存储到我的变量中，但我无法使其工作。

我只想在我想跳过的每个“th”元素上添加一个“skip”类，那么该列不应包含在循环中。

但我坚持迭代我的数组，我的条件在下一个循环中将为假，导致它在下一个循环中存储在我的变量中。

这是js

var i = [];
var value = [];

$('.report-table tr').each(function(){     

 $('th', this).each(function(index){
            if($(this).hasClass('skip'))
            {
            console.log(index);
            i.push(index);
            }
            else
            {
               value.push($(this).text());
            }


        }); 

 $('td', this).each(function(index){
            if(i.length!=0){ //this is where i am stuck right now
                for(var t = i.length-1; t>=0;t--){
                    if(i[t]==index)
                    {
                        console.log("skip :"+index);
                    }
                    else{
                         value.push($(this).text());
                    }
                }
            }
            else{
                value.push($(this).text());
            }

        }); 

});

和 html

  <table class="report-table table" id="dynamic-report">

              <thead>
                  <th width="50%">Period Ending</th>
                  <th width="5%" class="rowValue">Jan 31, 2010</th>
                  <th width="5%" class="rowValue skip">Feb 31, 2011</th>
                  <th width="5%" class="rowValue">Mar 31, 2012</th>
                  <th width="5%" class="rowValue">Apr 31, 2010</th>
                  <th width="5%" class="rowValue skip">May 31, 2011</th>
                  <th width="5%" class="rowValue">Jun 31, 2012</th>
                  <th width="5%" class="rowValue">Jul 31, 2010</th>
                  <th width="5%" class="rowValue">Aug 31, 2011</th>
                  <th width="5%" class="rowValue">Sep 31, 2012</th>
              </thead>
              <tbody>
             <tr class="indent-0 highLight bold">
                 <td>Asset</td>
                 <td class="emptyRow"></td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
             </tr>
             <tr class="indent-1 bold ">
                 <td >Current Assets</td>
                 <td class="emptyRow"></td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>

             </tr>
             <tr  class="indent-2">
                <td>Bank Accounts</td>
                <td class="emptyRow"></td>
                <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>


             </tr>
    </tbody>
</table>

Answer 1

你让事情变得比需要的更复杂。使用 jQuery index函数使用当前 td 的索引并将其与 th 的索引进行匹配，并查看该 th 是否具有跳过类别。单击下面的按钮查看实际效果。 (未定义只是因为我懒得检查空值!)

只需执行以下操作:

$(function() {
	var results = '';
	$('.report-table tr').each(function (row) {
	
		$('td', this).each(function (index) {
          var th;
		  $th = $('.report-table tr th:nth-of-type(' + index + ')');
          if ($th.hasClass('skip')) {
            results += 'skipping: ' + row + ' / ' + $th.html() + "\n";
          } else {
            results += 'not skipping: ' + row + ' / ' + $th.html() + "\n";
          }
	
		});
	
	});
	alert (results);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="report-table table" id="dynamic-report">

              <thead>
                  <th width="50%">Period Ending</th>
                  <th width="5%" class="rowValue">Jan 31, 2010</th>
                  <th width="5%" class="rowValue skip">Feb 31, 2011</th>
                  <th width="5%" class="rowValue">Mar 31, 2012</th>
                  <th width="5%" class="rowValue">Apr 31, 2010</th>
                  <th width="5%" class="rowValue skip">May 31, 2011</th>
                  <th width="5%" class="rowValue">Jun 31, 2012</th>
                  <th width="5%" class="rowValue">Jul 31, 2010</th>
                  <th width="5%" class="rowValue">Aug 31, 2011</th>
                  <th width="5%" class="rowValue">Sep 31, 2012</th>
              </thead>
              <tbody>
             <tr class="indent-0 highLight bold">
                 <td>Asset</td>
                 <td class="emptyRow"></td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
             </tr>
             <tr class="indent-1 bold ">
                 <td >Current Assets</td>
                 <td class="emptyRow"></td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>

             </tr>
             <tr  class="indent-2">
                <td>Bank Accounts</td>
                <td class="emptyRow"></td>
                <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>
                 <td class="rowValue">9,999,999.00</td>


             </tr>
    </tbody>
</table>