Javascript 使用Jquery/handlebar.js隐藏缺少值的表格单元格输出

我的桌子设计如下：

<tr>
  <th rowspan="6" scope="row">Payment History: <br><em>(Up to 25 months)</em></th>
  <td colspan="3">
    <table id="paymentHistory" cellspacing="1" summary="Payment History" class="table table-sm table-bordered" >
      <thead class="thead-default">
        <tr>
          <th style="white-space: nowrap;"></th>
          <th style="white-space: nowrap;">Jan</th>
          <th style="white-space: nowrap;">Feb</th>
          <th style="white-space: nowrap;">Mar</th>
          <th style="white-space: nowrap;">Apr</th>
          <th style="white-space: nowrap;">May</th>
          <th style="white-space: nowrap;">Jun</th>
          <th style="white-space: nowrap;">Jul</th>
          <th style="white-space: nowrap;">Aug</th>
          <th style="white-space: nowrap;">Sept</th>
          <th style="white-space: nowrap;">Oct</th>
          <th style="white-space: nowrap;">Nov</th>
          <th style="white-space: nowrap;">Dec</th>
        </tr>
        {{#each PaymentProfile}}
        <tr>
          <th rowspan="2">{{@key}}</th>
        </tr>
        <!--<tr>-->
        <!--{{#each this}}-->

        <!--<th style="white-space: nowrap;">{{months @key}}</th>-->
        <!--{{/each}}-->
        <!--</tr>-->
        <tr>
          {{#each this}}
          <td style="height: 42px;">{{hideEmptyData this}}</td>
          {{/each}}
        </tr>
        {{/each}}
      </thead>
    </table>
  </td>
</tr>

我正在尝试上面的代码。但我无法进入函数本身。 我无法在控制台中打印“表内”。 有人能告诉我我做错了什么吗

所以我想做的是隐藏空的表格单元格。例如，在2014年，所有月份的元素都为空，因此我不想显示2014年的行；在2015年，只应显示1月至8月的元素，因为其他元素为空

JSON数据如下：

"PaymentProfile":{  
                     "2015":{  
                        "1":"9",
                        "2":"-",
                        "3":"-",
                        "4":"-",
                        "5":"-",
                        "6":"9",
                        "7":"9",
                        "8":"B",
                        "9":" ",
                        "10":" ",
                        "11":" ",
                        "12":" "
                     },
                     "2014":{  
                        "1":" ",
                        "2":" ",
                        "3":" ",
                        "4":" ",
                        "5":" ",
                        "6":" ",
                        "7":" ",
                        "8":" ",
                        "9":" ",
                        "10":" ",
                        "11":" ",
                        "12":" "
                     }
                  },

有人能帮我吗？

---

首先，不要在表格单元格中添加内联样式：

高度：42px

<代码>默认情况下没有高度，因此如果您不在其中放置任何内容，它将具有

高度：0

。现在，

是相同的-默认情况下，它有

高度：0

，并获取其子级的

高度，这意味着如果没有，则由于默认的
高度
属性，它将不可见

看看这个例子：



一行
C1
C2
C3
补体第四成份
碳五
第一排
1.
2.
3.
4.
5.
第二排
1.
2.
3.
4.
5.
第四排
1.
2.
3.
4.
5.
使用以下代码解决了上述问题：
希望它能帮助别人

$('#paymentHistory tbody tr').each(function(){                       
                        var tr = $(this);                      
                        var tdNumber = tr.find('td').length;
                        var counter = 0;
                        tr.find('td').each(function () {                        
                            if ( $(this).text().trim() == '' ) counter++;                     
                        });                      
                        if ( counter == tdNumber ) tr.hide();
                    });

{{{#if td}}。。。{{/if}
@awd问题是我不想显示整个2014行，因为所有月份都是空的。那么我该怎么做呢？我想如果你能提供一个数据示例会有所帮助。@76484你指的是JSON数据？？我会在将数据传递到模板之前格式化数据。例如，删除没有月值的年份。这不起作用。此外，我的首要任务是，如果2014年的行是空的，就不要显示它。我该如何解决这个问题呢？注意我答案中的第三行——它完全是空的&不可见——看起来正是你想要的。我想我不明白您需要什么，因为设置
td:empty{height:42px；}
似乎做的正好相反：它为空元素提供了42px的高度。是的，当我删除helper hideEmptyData时，您的代码可以工作。我想删除2014年没有数据的月份。请参阅我的JSON数据和我的输出表
$('#paymentHistory tbody tr').each(function(){                       
                        var tr = $(this);                      
                        var tdNumber = tr.find('td').length;
                        var counter = 0;
                        tr.find('td').each(function () {                        
                            if ( $(this).text().trim() == '' ) counter++;                     
                        });                      
                        if ( counter == tdNumber ) tr.hide();
                    });