jquery如何获取数据表行的data-id值？

Question

我正在处理jquery datatable。我正在将用户输入数据添加到行中。

$('.add-row').on('click', function() {
            
            name = $('#name').val();
            email = $('#email').val();
            cno = $('#cno').val();
            bdy = $('#bday').val();
            t.row.add([
                name,
                email,
                cno,
                bdy,
                '<button class ="btn btn-danger del">Delete</button>' + '' + '<button class="btn btn-warning upd" data-id="'+$('#example').DataTable().rows().count()+'">Edit</button>'
            ]).draw(false);
            $("#name").val('');
            $("#email").val('');
            $("#cno").val('');
            $("#bday").val('');

        });

在上面的代码中，有data-id 我在其中添加行数。现在我也在删除该行。

 $("body").on("click", ".del", function() {

            if ($(row).hasClass('child')) {
                t.row($(row).prev('tr')).remove().draw();
            } else {
                t.row($(this).parents('tr')).remove().draw();
            }
        });

删除行后。行数为n-1。每当我尝试添加新行时，我都想获得最新的 data-id 值。例如，我添加了 3 行，行数为 3，所以 data-id 将是 3。所以我想获得 data-id 的最后/最新值

任何帮助将不胜感激？

Answer 1

更新

我搜索了最大的data-id，所以没有重复的问题

按照@FilipKováč 的建议，如果您确定最后一行始终具有最大 id，您可以尝试：var max = parseInt($("button.upd").last().data("id") || 0); 而不是我的 map 行。它的性能更好

$('.add-row').on('click', function() {
            var values = $.map($("button.upd"), function(el, index) { return parseInt($(el).attr("data-id")); });
            var max = Math.max.apply(null, values.length == 0 ? [0] : values);

            name = $('#name').val();
            email = $('#email').val();
            cno = $('#cno').val();
            bdy = $('#bday').val();
            t.row.add([
                name,
                email,
                cno,
                bdy,
                '<button class ="btn btn-danger del">Delete</button>' + '' + '<button class="btn btn-warning upd" data-id="'+ (max + 1) +'">Edit</button>'
            ]).draw(false);
            $("#name").val('');
            $("#email").val('');
            $("#cno").val('');
            $("#bday").val('');

        });

 $("body").on("click", ".del", function() {
            if ($(row).hasClass('child')) {
                t.row($(row).prev('tr')).remove().draw();
            } else {
                t.row($(this).parents('tr')).remove().draw();
            }
        });

如果你想重新索引 data-id：

$("button.upd").each(function(index){
  $(this).attr("data-id", index);
}

您在删除函数中执行此操作..并将初始代码保留在您的添加函数中