请参阅fiddle http://jsfiddle.net/8hnmw8j1/。当我单击单元格时,我可以获得值和列名。我想知道如何获取行索引和列索引?以下是js代码,
<script type="text/javascript">
$(document).ready(function(){
$('#example tbody').on( 'click', 'td', function () {
alert('Data:'+$(this).html().trim());
alert('Row:'+$(this).parent().find('td').html().trim());
alert('Column:'+$('#example thead tr th').eq($(this).index()).html().trim());
});
});
</script>
另一种 Native JS 方法是使用 TableData 属性,这些属性可以在使用表元素时找到。例如,cellIndex
将返回a的列索引td
元素和rowIndex
将返回a的索引tr
元素。这两个属性将大大简化我们的代码,如以下代码所示。
const cells = document.querySelectorAll('td');
cells.forEach(cell => {
cell.addEventListener('click', () =>
console.log("Row index: " + cell.closest('tr').rowIndex + " | Column index: " + cell.cellIndex));
});
<table>
<tr>
<td>0:0</td>
<td>0:1</td>
<td>0:2</td>
<td>0:3</td>
</tr>
<tr>
<td>1:0</td>
<td>1:1</td>
<td>1:2</td>
<td>1:3</td>
</tr>
<tr>
<td>2:0</td>
<td>2:1</td>
<td>2:2</td>
<td>2:3</td>
</tr>
</table>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)