发表新帖
发表新帖

Iterate through and delete empty HTML table rows with jQuery

前端 未结
关注
4 958
梦如初夏
梦如初夏 2021-01-18 18:50

I am attempting to iterate through a HTML table using jQuery and delete empty rows. The page is driven by ASP.NET and with certain permission, items in the table will be hid

相关标签:
4条回答
  • 迷失自我
    2021-01-18 19:21

    I think it is better to use the '.parent()' method, because a 'tr' tag is always the next parent from a 'td' tag.

    0 讨论(0)
  • 悲&欢浪女
    2021-01-18 19:31

    Your code appears to work just fine. Try running the following on its own to see what I mean:

    <html>
<head>
    <title>jQuery Tests</title>

    <script src="http://code.jquery.com/jquery-1.5.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('tr').each(function () {
                $(this).find('td').each(function () {
                    if ($(this).text().trim() == "") {
                        $(this).closest("tr").remove();
                    };
                });
            });
        });
    </script>

</head>
<body>
    <table cellpadding="0" cellspacing="0" border="1">
        <tr>
            <td></td>
            <td>testing</td>
        </tr>
        <tr>
            <td>testing</td>
            <td>testing</td>
        </tr>
        <tr>
            <td>testing</td>
            <td>   </td>
        </tr>
    </table>
</body>

    Could there be something else on the page that might be conflicting?

    0 讨论(0)
  • 无人及你
    2021-01-18 19:32

    Lead to problem in case We have Only TD empty and all other TD is Filled

    I'm change the Code to make this in its consideration

    <script type="text/javascript">
        $(document).ready(function () {

            $('tr').each(function () {
                var totalTDs = $(this).find('td').length;
                var emptyTDS = 0;

                $(this).find('td').each(function () {
                    if ($(this).text().trim() == "") {
                        emptyTDS += 1;
                    };
                });

                if (emptyTDS == totalTDs) {
                    $(this).remove();
                }
            });
        });
    </script>
    0 讨论(0)
  • 刺人心
    2021-01-18 19:38

    Try this:

    var td = $(this).find('td:empty');
if ( td.length > 0 ) $(this).remove();

    http://api.jquery.com/empty-selector/

    That said, you really want to do this on the server side. It'll look ugly on the client side because you'll have the empty rows messing things up until the document ready event is fired.

    0 讨论(0)
 看不清?
提交回复
热议问题