隐藏动态添加的列/字段

Question

我有一些动态创建的行/列。我想要做的是设置它的一部分（txtOffsetID）隐藏。我试过这个：txtOffsetID.setAttribute('type', 'hidden');但它没有工作。我想隐藏整个列和添加的新列。我需要它在IE中工作。谢谢。

示例代码：

function addNewOffsetItem() 
{ 
    var iX = document.getElementById("txtOffsetIndex").value; 
    iX ++; 
    document.getElementById("txtOffsetIndex").value = iX; 

    var tbl = document.getElementById("tblOffsetDetail").getElementsByTagName("TBODY")[0]; 
    var tr = document.createElement("TR"); 
    tbl.appendChild(tr); 

    //This section should be hidden.  
    //txtOffsetID1 
    var tdID = document.createElement("TD"); 
    tr.appendChild(tdID); 

    var p = document.createElement("P"); 
    tdID.appendChild(p); 

    var txtOffsetID = document.createElement("input"); 
    p.appendChild(txtOffsetID); 

    txtOffsetID.id = "txtOffsetID" + iX; 
    txtOffsetID.setAttribute('name','txtOffsetID' + iX); 
    **document.getElementById("colOffsetID").style.display="none";** 

    //This section should be visible. 
    //txtOffsetComments1 
    var tdComments = document.createElement("TD"); 
    tr.appendChild(tdComments); 

    var p = document.createElement("P"); 
    tdComments.appendChild(p); 

    var txtOffsetComments = document.createElement("textarea"); 
    p.appendChild(txtOffsetComments); 

    txtOffsetComments.id = "txtOffsetComments" + iX; 
    txtOffsetComments.setAttribute('name','txtOffsetComments' + iX);  
} 

<table width="99%" border="1" cellpadding="1" cellspacing="1" id="tblOffsetDetail"> 
    <colgroup> 
    <col id="colOffsetID"> 
    <col id="colOffsetComments"> 
    </colgroup> 
    <tbody>  
     <tr> 
      <td><input type="text" id="txtOffsetID" name="txtOffsetID"></td> 
      <td><p><textarea name="txtOffsetComments" cols="15" rows="3" id="txtOffsetComments"></textarea></p></td>   
     </tr> 
    </tbody> 
</table> 

Answer 1

创建“TR”元素可以被隐藏这样

 
tr.setAttribute('style', 'display: none;'); 

，但如果你想比你需要使用COLGROUP表元素
隐藏列满示例

 
<table> 
<colgroup> 
<col id="colOne"> 
<col id="colTwo"> 
<col id="colThre"> 
</colgroup> 
<tbody> 
<tr> 
<td>one</td> 
<td>two</td> 
<td>three</td> 
</tr> 
</tbody> 

您可以隐藏colTwo li柯本

 
document.getElementById('colTwo').style.display = 'none'; 

我希望这有助于