javascript - 回调函数删除两项而不是一项

Question

这里有什么问题:

function deluser() {
    var id = $('.nameact').attr('data-id');
    $.post('users-pro-del.php', {id}, function(data) {
        $('.nameact').remove();
        $('.namesingle').eq(0).addClass('nameact');
    });
}

users-pro-del.php - 从数据库中删除用户。

所以我想从屏幕上删除相应的项目
$('.nameact').remove();

并将 active 状态赋予另一个(第一个)项目:$('.namesingle').eq(0).addClass('nameact');

有时它工作正常。

但更常见的是 - $('.namesingle').eq(0) 也被删除了!

正如我在控制台中看到的那样 - 每个时刻只有一个 .nameact。

有什么帮助吗？

Answer 1

Ajax 具有异步特性。 $.post 之前的 id = $('.nameact') 可能与 ajax 请求之后的 $('.nameact') 不同。最好到处通过 Id 引用 nameact。

function deluser() {
var id = $('.nameact').attr('data-id');
console.log('id to delete: ' + id);
$.post('users-pro-del.php', {id}, function(data) {
    $('.nameact[data-id="' + id + '"]').remove(); // to be sure we delete the same object in php and JS
    console.log('deleted id: ' + id);
    $('.namesingle').eq(0).addClass('nameact');
});