当所有行都为空时,jQuery删除div容器中的表

时间:2013-06-26 14:33:13

标签: jquery html-table

我需要做一些表清理,不知道如何去做。在这种情况下,当在现有表4上达到列限制时,我正在创建新表。

需要进行清理,因为表格是使用样式为style="DISPLAY: none"的行中的tds创建的。

 <table style="border-bottom: #000 1px solid; margin-top: 10px; width: 1000px; float: left; border-right: #000 1px solid">
        <tbody>
            <tr class="tableHeader tbsectionheader">
                <td style="display: none" class="flow_header">
                    ALLERGEN SPECIFIC IGE
                </td>
                <td style="display: none" class="flow_header">
                    CLASS
                </td>
                <td style="display: none" class="flow_header">
                    Carbon dioxide 
                </td>
            </tr>
            <tr>
                <td style="display: none" class="flow_data">
                 </td>
                <td style="display: none" class="flow_data">
                 </td>
                <td style="display: none" class="flow_data">
                 </td>
            </tr>
            <tr>
                <td style="display: none" class="flow_data">
                </td>
                <td style="display: none" class="flow_data">
                </td>
                <td style="display: none" class="flow_data">
                </td>
            </tr>
            <tr>
                <td style="display: none" class="flow_data">
                </td>
                <td style="display: none" class="flow_data">
                </td>
                <td style="display: none" class="flow_data">
               </td>
            </tr>
            <tr>
                <td style="display: none" class="flow_data">
                </td>
                <td style="display: none" class="flow_data">
                </td>
                <td style="display: none" class="flow_data">
               </td>
            </tr>
        </tbody>
    </table>

以下是生成标记的完整代码,我应该在根本原因解决问题(如果所有行都为空,不要创建表)只是不确定如何去做。如果所有td都是空的但是无法正确编制索引,我试图删除行。

仅供参考 - 所有此标记都将使用.net

转换为pdf
 $(document).ready(function () {
                if (window.opener != null && !window.opener.closed) {
                    var tbl = $get('<%=hfTableId.ClientID%>').value;
                    var tblstring = window.opener.document.getElementById(tbl).value;
                    $("#tblFlowsheet").html(tblstring);
                    $("#divTtableContainer").append($("#tblFlowsheet"));
                    hideEmptyCols();
                    $get('<%=hfFlowsheetTable.ClientID%>').value = $("#divTtableContainer").html();
                    __doPostBack('DoPrint', 'True');
                }
            });

            function hideEmptyCols() {
                var $table = $("#tblFlowsheet")
                var $thead = $('tr.tableHeader', $table).first();
                var isEmpty = new Array();
                $('td', $thead).each(function (i) {
                    var j = i;
                   //select all tds in this column
                    var tds = $(this).parents('table').find('td:nth-child(' + (i + 1) + ')');
                    //check if all the cells in this column are empty
                    if ((tds.length - 1) == tds.filter(':empty').length) {
                        isEmpty[isEmpty.length] = j
                        //tds.remove();
                        //hide header
                        //$(this).remove();
                    }
                });
                for (var x in isEmpty) { $('td:nth-child(' + (isEmpty[x] + 1) + ')').hide(); }
                splitTable($table);
                $('td').each(function () {
                    if ($(this).text() == '') {
                        $(this).html("&nbsp;");
                   }
                });
              }

      function splitTable(table) {
         trs = table.find('tr');
         $('<table>').insertAfter(table);
         var limit = 3;
          if(table.find('tr:first-child>td').length>limit) {
              newTable = table.next('table');
              newTable.attr('style', 'width:1000px;float:left; margin-top: 10px;border-bottom: solid 1px #000; border-right: solid 1px #000;');
              newTable.append('<tbody>');
              trs.each(function () {
                    tr = $(this);
                    clone = tr.clone();
                    clone.html('');
                    newTable.find('tbody').append(clone);
                    lastTr = newTable.find('tr:last-child');
                    lastTr.append($('>:gt('+limit+')',this));
                });
                splitTable(newTable);
            }
        }

1 个答案:

答案 0 :(得分:0)

不确定完全理解你想要什么,但我猜你要删除他们的孩子没有文字的行。如果是这种情况,请使用:

$('tr').filter(function(){
    var containText = true
    $(this).children().each(function(){
        containText = $(this).text().trim().length == 0;
        return containText;
    })
    return containText;
}).remove();

如果所有三个td都为空,则会移除tr