jquery - 如何在 .draw() 之后保持 jQuery DataTables 滚动位置

Question

我正在使用 jQuery Datatables 插件来创建一个小表(12 行)。一些<input type="text" ...字段允许编辑。当输入字段失去焦点时，我需要验证其值并可能更改字段值。如果不发出.draw()，我就无法让数据表识别修改后的输入字段值。之后，但这会导致表格滚动到表格顶部。

有没有办法在发出 .draw() 后保持当前滚动位置？

$('#mytable').on('blur', 'input', function (e) {

    var inputFieldId = this.id;
    var inputFieldVal = $(this).val();

    { ... perform validation of field value ... }

    $('#mytable').DataTable().rows().invalidate().draw();
});

编辑

我看到有人试图做与我相同的事情，他们表示以下代码对他们有用。这似乎是完成我需要的一个非常简单的方法，但我自己总是得到scrollTop = 0。有人知道我如何获取当前所选行的行索引吗？

var scrollPos = $(".dataTables_scrollBody").scrollTop();
$('#mytable').DataTable().rows().invalidate().draw(false);
$(".dataTables_scrollBody").scrollTop(scrollPos);

Answer 1

var table = $('table#example').DataTable({
    "preDrawCallback": function (settings) {
        pageScrollPos = $('div.dataTables_scrollBody').scrollTop();
    },
    "drawCallback": function (settings) {
        $('div.dataTables_scrollBody').scrollTop(pageScrollPos);
    }
});

这似乎对我有用。我只需在绘制表格后找到 div.dataTables_scrollBody 即可。