jquery - 即使为空也保留 td "expanded"

Question

情况

情况是，在我正在处理的程序中，我有一个 2 * 10 的表，每个 <td>表示我将在其中打印元素的纸张区域。

问题

问题是，一次只有一个单元格包含信息，在这种情况下，整个表格“折叠”并且不符合表格单元格格式。

我做了什么

我相信我已经尝试了所有可能的选择，

&nbsp,empty-cells:show, table-layout: fixed;

这些选项都没有帮助我，当表为空时“关闭”我最后的选择是在所有单元格中放置一个空白的占位符图像。然而失败了，因为当我将我的具体细节添加到代码中时，它“低于”空白图像有效地抛弃了我的 table

这是表格代码的一部分

<table border="1" cellpadding="3" id="labelData">
    <tr>
        <td class="blankl">
            <div id="content">

                <img src="~/Content/Image/blankimg.png" alt="Image" />

            </div>
        </td>
        <td class="blankl" style="width:303px; height:5px">
            <div id="content">

                <img src="~/Content/Image/blankimg.png" alt="Image" />

            </div>
        </td>

    </tr>
</table>

点击单元格添加“事件类”数据的脚本

 var content = $('#content');
            $('td').click(function () {
                $('td').removeClass('active');
                $('td').removeClass('blankl');

                $(this).append(content).addClass('active');

编辑添加了 Fiddle，但奇怪的是它在其中起作用。

https://jsfiddle.net/kemcoder/95jdr5pp/

我还应该补充一点，当我尝试打印时出现表格问题。

function printData() {


    var divToPrint = document.getElementById("labelData");
    newWin = window.open("");
    newWin.document.write(divToPrint.outerHTML);
    newWin.print();
    newWin.close();

}

Answer 1

你能给每个单元格一个固定的高度和一个百分比宽度吗？

#labelData td {
    width: 20%;
    height: 100px;
}