时间戳

首页 > 解决方案 > 如果它是空的，我该如何隐藏

javascript - 如果它是空的，我该如何隐藏

问题描述

我有一个表，它根据从我的数据库中提取的数据动态地获取输出到它的数据。我有三个硬编码<tr>，但如果没有任何数据<td>从数据库输出到它们，我想隐藏它们。

这是我的 HTML

                <table class="table text-light text-end" id="data_table">
                    <thead>
                        <tr>
                            <th></th>
                            {{#each response4}}
                            <th class='title' scope="col">{{commodity}}</th>
                            {{/each}}
                            <th scope="col">Total</th>
                        </tr>
                    </thead>
                    <tbody class="text-end">
                        <tr>
                            <th scope="row">AUX</th>
                            {{#each response6}}
                            <td class="whole">{{fb_plus_fr}}</td>
                            {{/each}}
                        </tr>
                        <tr>
                            <th scope="row">UEM</th>
                            {{#each response4}}
                            <td class="whole">{{fb_plus_fr}}</td>
                            {{/each}}
                        </tr>
                        <tr>
                            <th scope="row">UT</th>
                            {{#each response5}}
                            <td class="whole">{{fb_plus_fr}}</td>
                            {{/each}}
                        </tr>
                    </tbody>
                </table>

这是我在页面加载并从数据库中获取数据时从检查工具中提取的示例。第一个<tr>没有<td>，应该隐藏。

                   <tbody class="text-end">
                        <tr>
                            <th scope="row">AUX</th>
                        </tr>
                        <tr>
                            <th scope="row">UEM</th>
                            <td class="whole">8215</td>
                            <td class="whole">5367</td>
                            <td class="whole">31193</td>
                        </tr>
                        <tr>
                            <th scope="row">UT</th>
                            <td class="whole">8215</td>
                            <td class="whole">5367</td>
                            <td class="whole">31193</td>
                        </tr>
                    </tbody>

这就是我尝试的方式，但这不起作用。它不会首先隐藏没有任何数据的那个。非常感谢任何有关如何解决此问题的建议！

 window.onload = () => {

        $("#data_table > tbody > tr ").each(function () {
            if ($(this).find('td').is(":empty")){
                $(this.hide())
            }
        })  
    };

标签： javascriptjquery

解决方案

此代码可以帮助您：

 <tr th:if="${yourtable.empty}">
            <td colspan="2">No Content Available</td>
        </tr>

推荐阅读