如何判断鼠标单击的单元格相对于单元格所在行的索引值
解决思路:
利用单元格的cellIndex属性即可实现
具体步骤:
代码示例:
<table width="200" height="30" border="1">
<tr>
<td onClick="alert(this.cellIndex)">demo</td>
<td onClick="alert(this.cellIndex)">demo</td>
<td onClick="alert(this.cellIndex)">demo</td>
</tr>
</table>
注意:cellIndex返回的是以0开始的索引值,例如第一个单元格返回0,第二个单元格则为1,以此类推。
提示:要取得当前行相对于表格的索引值用rowIndex。
技巧:用rowIndex取得单元格所在行在表格中的索引值,cellIndex取得单元格在所在行的索引值,有了这两个数据就可以知道单元格的位置是第几行第几列了。
试一试:写个在单元格上单击时获取到该单元格的所在行和列。
特别提示
代码运行后,单击第二个单元格,将弹出警告框,内容为 1,效果如图 1.2.36所示。
图 1.2.36 单击单元格时提示该单元格相对于所在行的索引值
本例用到了单元格的 cellIndex属性,附带介绍了表格行的 rowIndex属性,跟这两个属性相关的集合有rows和cells。
cellIndex获取对象于所在行的 cells 集合中的位置。
rowIndex获取对象在表格的 rows 集合中的位置。
cells 获取表格行或整个表格中所有单元格的集合。
rows 获取来自于 table 对象的 tr (表格行)对象的集合。
解决思路:
利用单元格的cellIndex属性即可实现
具体步骤:
代码示例:
<table width="200" height="30" border="1">
<tr>
<td onClick="alert(this.cellIndex)">demo</td>
<td onClick="alert(this.cellIndex)">demo</td>
<td onClick="alert(this.cellIndex)">demo</td>
</tr>
</table>
注意:cellIndex返回的是以0开始的索引值,例如第一个单元格返回0,第二个单元格则为1,以此类推。
提示:要取得当前行相对于表格的索引值用rowIndex。
技巧:用rowIndex取得单元格所在行在表格中的索引值,cellIndex取得单元格在所在行的索引值,有了这两个数据就可以知道单元格的位置是第几行第几列了。
试一试:写个在单元格上单击时获取到该单元格的所在行和列。
特别提示
代码运行后,单击第二个单元格,将弹出警告框,内容为 1,效果如图 1.2.36所示。
图 1.2.36 单击单元格时提示该单元格相对于所在行的索引值
特别说明
本例用到了单元格的 cellIndex属性,附带介绍了表格行的 rowIndex属性,跟这两个属性相关的集合有rows和cells。
cellIndex获取对象于所在行的 cells 集合中的位置。
rowIndex获取对象在表格的 rows 集合中的位置。
cells 获取表格行或整个表格中所有单元格的集合。
rows 获取来自于 table 对象的 tr (表格行)对象的集合。