jquery - 使用 jQuery 提取点击的 HTML 表格的单元格索引

Question

我正在寻找一种使用 jQuery 对普通 HTML 表格执行以下操作的方法。

1. 提取被点击单元格的索引及其所属行的索引。
2. 突出显示所选单元格并在再次单击时取消突出显示。
3. 跟踪选中的单元格，以便我可以将它们保存到数据库中。

这是我到目前为止所做的:

$("#frame td").click(function(e) {

    var RowSelected = $(this).parent().parent().children().index($(this).parent());
    var CellSelected = e.target.cellIndex;

    $(this).toggleClass("selected", this.clicked);

    $("#cells").append("R" + RowSelected + "C" + CellSelected + ", ");

});

Answer 1

DOM 为您提供 rowIndex 以及 cellIndex，不需要疯狂的 jQuery index 工作。

此外，如果您将选定单元格列表的生成推迟到提交时，您将不必尝试通过在单击时添加和删除元素来跟踪它们:

$('#frame td').click(function() {
    $(this).toggleClass('selected');
});

$('#someform').submit(function() {
    $('#cells').val(
        $('#frame td.selected').map(function() {
            return 'R'+this.parentNode.rowIndex+'C'+this.cellIndex;
        }).get().join(', ')
    );
});

假设 #cells 是您用来传递信息的隐藏输入。