jquery - 如何在基于 div 的表中隐藏列

Question

我使用 JQuery。我需要隐藏表的列(基于 div)。在下面的示例中，我需要在单击复选框时隐藏/显示文本框。隐藏文本框后，第 2 段将移至上方。同样，我不需要更改客户名称和地址的位置。

HTML代码是

<input type="checkbox" id="chk" />Check it, if customer has no company.
<span>Paragraph 1st Lorem Ipsum  Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum </span>
        <div class="divTable">
             <div class="headRow">
                <div class="divCell" align="center">Company Name</div>
                <div  class="divCell">Customer Name</div>
                <div  class="divCell">Customer Address</div>
             </div>
            <div class="divRow">
                <div class="divCell" align="center"><input type="text" /></div>
                <div class="divCell" align="center">Customer Name</div>
                <div class="divCell" align="center">Customer Address</div>
            </div>
            <div class="divRow">
                <div class="divCell" align="center"><input type="text" /></div>
           </div>
            <div class="divRow">
                <div class="divCell" align="center"><input type="text" /></div>
           </div>
      </div>
<p>Paragraph 2nd Lorem Ipsum  Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum Lorem Ipsum </P>

CSS 是，

.divTable
{
    display:  table;
    width:auto;
    background-color:#eee;
    border:1px solid  #666666;
    border-spacing:5px;
}

.divRow
{
   display:table-row;
   width:auto;

}

.divCell
{
    float:left;
    display:table-column;
    width:200px;
    background-color:#ccc;

}

如何隐藏表格的列(基于 div)？

Answer 1

这可行:

$("input[type=checkbox]").on("change", function(){
    $("input[type=text]").toggle();
});