社区
JavaScript
帖子详情
如何显示表格的行和列
todogames
2006-02-10 11:09:32
我要在页面上画一个10*10的表格,要求当鼠标放在每一个各自上时显示这个格子是第几行第几列的。
请DX赐教!
...全文
69
6
打赏
收藏
如何显示表格的行和列
我要在页面上画一个10*10的表格,要求当鼠标放在每一个各自上时显示这个格子是第几行第几列的。 请DX赐教!
复制链接
扫一扫
分享
转发到动态
举报
写回复
配置赞助广告
用AI写文章
6 条
回复
切换为时间正序
请发表友善的回复…
发表回复
打赏红包
laochake
2006-02-10
打赏
举报
回复
<script language="javascript">
function showRC(cell){
var colsNum = cell.cellIndex+1;
var rowsNum = cell.parentElement.rowIndex+1;
alert("行:" + rowsNum + "列:"+ colsNum);
}
</script>
<td onclick="showRC(this)">
pli0825
2006-02-10
打赏
举报
回复
<script language="javascript">
function showRC(obj)
{
var colsNum = obj.cellIndex+1;//which col
var par_id = obj.parentElement.id;
var rowsNum = document.getElementById(par_id).rowIndex+1;
alert("in "+rowsNum+" Row and in "+colsNum+" Colum");
}
</script>
<TABLE id="Table1" cellSpacing="1" cellPadding="1" width="300" border="1">
<TR id="r1">
<TD onmouseover="showRC(this)">11</TD>
<TD onmouseover="showRC(this)">12</TD>
<TD onmouseover="showRC(this)">13</TD>
</TR>
<TR id="r2">
<TD onmouseover="showRC(this)">21</TD>
<TD onmouseover="showRC(this)">22</TD>
<TD onmouseover="showRC(this)">23</TD>
</TR>
<TR id="r3">
<TD onmouseover="showRC(this)">31</TD>
<TD onmouseover="showRC(this)">32</TD>
<TD onmouseover="showRC(this)">33</TD>
</TR>
</TABLE>
-神仙-
2006-02-10
打赏
举报
回复
<td id="r1c1">...
<td id="r2c1">
todogames
2006-02-10
打赏
举报
回复
谢谢laochake,
我学会了<td onmouseover="showCellRC(this);">
<td onclick="showRC(this)">
非常精彩的一课。
但是,如果格子的数目是几百几千个,那么用这种方法,可能太麻烦了?
有简单的方法吗?
在表格中嵌入一个JS,
让他自动分析单元格的数目,并在鼠标悬停时显示信息。
laochake
2006-02-10
打赏
举报
回复
<script language="javascript">
function showCellRC(cell){
var rowNum = cell.parentElement.rowIndex+1;
var colNum = cell.cellIndex+1;
cell.title="行:"+rowNum+"; 列:"+colNum;
}
</script>
<table border=1>
<tr>
<td onmouseover="showCellRC(this);">显示行列</td>
<td onmouseover="showCellRC(this);">显示行列</td>
</tr>
<tr>
<td onmouseover="showCellRC(this);">显示行列</td>
<td onmouseover="showCellRC(this);">显示行列</td>
</tr>
</table>
todogames
2006-02-10
打赏
举报
回复
先谢谢,大家!
我想鼠标在格子上悬停时出现上述信息。
BootStrapTable
表格
利器通用教材
开发响应式界面,固定表头,完全可配置,支持data属性,
显示
/隐藏列,
显示
/隐藏表头,使用AJAX获取JSON数据,点击表头可简单的进行排序,支持自定义列
显示
,支持单/复选,强大的分页功能,支持名片布局,支持多语言 ...
vue element
表格
数据 Table
表格
行数据转列
显示
列数据转行
显示
【代码】vue Table
表格
行数据转列
显示
列数据转行
显示
。
原生JS实现不固定
行和列
的
表格
起始
显示
一行一列的
表格
th,然后根据用户是否输入值,动态增加
行和列
,每次根据倒数第二行是否有值,以此来判断是否要新增行,每次根据倒是第二列是否有值,以此来判断是否要新增列,然后根据
行和列
的值是否清空,...
HTML
表格
属性跨列,HTML
表格
的使用 与 跨行跨列
表格
的基本语法:第一个单元格的内容第二个单元格的内容第一个...在行标签tr里创建单元格标签td可以有多个单元格为了
显示
表格
的轮廓,一般还需要设置table标签的border边框属性,指定边框的宽度代码示例:效果图...
HTML
表格
中的行合并与列合并
colspan是横向合并;rowspan是纵向合并。 在
表格
制作中,常常要用到列合并与行合并的属性。下面是一个七行三列的
表格
,我们来观察一下列合并与行合并后的情况。
JavaScript
87,910
社区成员
224,616
社区内容
发帖
与我相关
我的任务
JavaScript
Web 开发 JavaScript
复制链接
扫一扫
分享
社区描述
Web 开发 JavaScript
社区管理员
加入社区
获取链接或二维码
近7日
近30日
至今
加载中
查看更多榜单
社区公告
暂无公告
试试用AI创作助手写篇文章吧
+ 用AI写文章