EasyUI datagrid隐藏<thead>表头

<div id="IMSIS" class="easyui-tabs" style="padding:2px;">
					<div title="设备" style="padding:0px">
						<table class="easyui-datagrid" style="width:auto;height:auto;">
							<thead>
								<tr>
									<th data-options="field:'itemid',width:203"><b style="color:#505050">SIM卡号</b></th>
									<th data-options="field:'productid',width:203"><b style="color:#505050">IMSI</b></th>
								</tr>
							</thead>
							<tbody>
							
								<tr style="display: none;"><td><b style="color:#505050">SIM卡号</b></td><td><b style="color:#505050">IMSI</b></td></tr>

							</tbody>
						</table>
					</div>
<style type="text/css">
    	/* 隐藏表格表头 */
		#IMSIS .datagrid-header {
			position: absolute; visibility: hidden;
		}
				
	</style>


转载于:https://my.oschina.net/hehongbo/blog/626087

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在上述代码中,使用了一个`<table>`元素来呈现表格,并在表格的第一行添加了一个`<legend>`元素作为标题。在第一行的标题中,使用了一个`<a>`元素来实现“增加行”功能,并为它添加了一个`onclick`事件,当用户点击时会调用JavaScript中的`addTableRow()`函数。 在表格的第二行开始,使用`<thead>`元素来定义表格的表头,其中包括每个列的标题。在每个单元格中,使用`<input>`元素来呈现表格中的数据,并根据需要设置不同的`type`属性(如`text`, `date`, `file`等)。 在每一行的第一列中,使用了一个“删除”按钮,当用户点击该按钮时会调用JavaScript中的删除函数,从而实现删除该行的操作。 JavaScript代码示例(增加行和删除行): ```javascript // 增加行 function addTableRow() { var table = document.querySelector('table'); var newRow = table.insertRow(-1); var cells = ['操作', '提单号/运单号', '一程日期', '二程日期', '预计到货日期', '海船公司', '放箱日期', '放箱单上传']; for (var i = 0; i < cells.length; i++) { var cell = newRow.insertCell(i); if (i === 0) { cell.innerHTML = '<input type="button" name="comment" value="删除" onclick="deleteTableRow(this)">'; } else { cell.innerHTML = '<input type="text" name="comment">'; } } } // 删除行 function deleteTableRow(button) { var row = button.parentNode.parentNode; row.parentNode.removeChild(row); } ``` 在`addTableRow()`函数中,首先找到表格元素,然后使用`insertRow()`方法在表格的末尾插入一行。接着,循环遍历每个单元格,并使用`insertCell()`方法将单元格插入到新行中,根据需要设置不同的内容和属性。在第一列中,使用`<input>`元素创建一个“删除”按钮,并为它添加一个`onclick`事件,当用户点击时会调用`deleteTableRow()`函数。最后,在`deleteTableRow()`函数中,找到要删除的行,并使用`removeChild()`方法将其从表格中删除。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值