我知道如何使用 jQuery 获取单元格的行和列索引,但我无法弄清楚相反的情况。给定行和列索引,我将如何访问该位置的 td?
使用纯 JavaScript:
// table is a reference to your table
table.rows[rowIndex].cells[columnIndex]
HTMLTableElement
, HTMLTableRowElement
.eq()
:
$('#table tr').eq(rowIndex).find('td').eq(columnIndex)
// or
$('#table tr:eq(' + rowIndex + ') td:eq(' + columnIndex + ')')
使用
nth-child
选择器怎么样?
http://api.jquery.com/nth-child-selector/
var row = 4;
var col = 2
var cell = $('table#tableId tr:nth-child(' + row + ') td:nth-child(' + col + ')');
请注意,子索引是从 1 开始的,而不是更常见的从 0 开始。
您可以使用
:eq
选择器:
var row = 1;
var col = 2;
var cell = $('table tr:eq(' + row + ') td:eq(' + col + ')');
这是一个 实际例子
这是一个纯 JavaScript 示例。请参阅 HTML 底部的脚本。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- [Getting td by index with jQuery (N.B. also tagged javascript)](https://stackoverflow.com/questions/6139407/getting-td-by-index-with-jquery)
used table from [javascript: getting td index [duplicate]](https://stackoverflow.com/questions/6470877/javascript-getting-td-index)
-->
<table>
<thead>
<tr><th>1</th> <th>2</th> <th>3</th></tr>
</thead>
<tbody>
<tr><td onclick="showIx(this)">data</td> <td onclick="showIx(this)">checkbox</td> <td onclick="showIx(this)">data</td></tr>
</tbody>
</table>
</body>
<script>
function showIx(myTDobj){
/**
* see [cellIndex >> HTMLTableCellElement - Web APIs | MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLTableCellElement)
*/
alert(myTDobj.cellIndex);
}
</script>
</html>
爱与和平,
乔