<table>
<tr>
<td><label>请选择商品:</label></td>
<td>
<select id="selectGoods4" class="easyui-combobox" panelHeight="auto" style="width:150px"
data-options="valueField:'id',textField:'name',url:'/goods/getAllGoodsWithIdAndName',onSelect: function(rec){
showSOSelect(rec);
}">
</select>
</td>
</tr>
<tr>
<td><label>录入数量:</label></td>
<td><input id="inputGoodsNum4" class="easyui-numberbox" data-options="min:0" style="width:150px"></td>
</tr>
<tr style="display: none;" id="trArr1">
<td><label id="lableNameArr1">规格名:</label></td>
<td>
<select id="selectSpecOptionArr1" class="easyui-combobox" panelHeight="auto" style="width:150px"
data-options="valueField:'soId',textField:'soName'">
</select>
</td>
</tr>
</table>
在通过JS代码
$("#trArr1").css('display','block');//block是display的默认值
设置trArr1显示时table的布局乱了,界面如下:
trArr1显示的宽度变成了第一行第一列的宽度,查阅资料,在设置tr需要设置成“table-row”,修改代码如下:
$("#trArr1").css('display','table-row');//block是display的默认值
界面正常显示: