Javascript 当快速点击“喜欢”按钮得到未知的喜欢时

我正在做一个项目，它有“喜欢-不喜欢”功能，看起来像facebook，但当我一次多次点击“喜欢”按钮或“不喜欢”按钮时，我会被卡住，然后它的工作就像开火，如果我有一个或两个“喜欢”按钮，我快速点击多次，那么我的“喜欢”就变成了-2-1。我如何解决这个问题？如果点击多次，总是得到完美的结果。在我的jquery脚本下面

$(document).ready(function () {
    $(".like").click(function () {
        var ID = $(this).attr("idl");
        var REL = $(this).attr("rel");
        var owner = $(this).attr("owner");
        var URL = 'box_like.php';
        var dataString = 'msg_id=' + ID + '&rel=' + REL + '&owner=' + owner;
        $.ajax({
            type: "POST",
            url: URL,
            data: dataString,
            cache: false,
            success: function (html) {
                if (REL == 'Like') {
                    $('.blc' + ID).html('Unlike:').attr('rel', 'Unlike').attr('title', 'Unlike');
                    $('.spn' + ID).html(html);
                } else {
                    $('.blc' + ID).attr('rel', 'Like').attr('title', 'Like').html('Like:');
                    $('.spn' + ID).html(html);
                }
            }
        });
    });
});

---

这是因为ajax请求的异步性质。。。。当您连续单击元素时。。。单击事件将在上一个请求的响应返回之前触发，链接状态将更新为下一个

案例： 假设rel不一样，那么在响应再次返回之前，会发生另一次单击，因此rel尚未更新，因此您将向服务器发送另一个不一样的请求，而不是类似的请求

尝试以下未测试的解决方案

$(document).ready(function () {
    var xhr;
    $(".like").click(function () {
        var ID = $(this).attr("idl");
        var REL = $(this).attr("rel");
        var owner = $(this).attr("owner");
        var URL = 'box_like.php';
        var dataString = 'msg_id=' + ID + '&rel=' + REL + '&owner=' + owner;
        if (REL == 'Like') {
            $('.blc' + ID).html('Unlike:').attr('rel', 'Unlike').attr('title', 'Unlike');
        } else {
            $('.blc' + ID).attr('rel', 'Like').attr('title', 'Like').html('Like:');
        }

        //abort the previous request since we don't know the response order
        if (xhr) {
            xhr.abort();
        }

        xhr = $.ajax({
            type: "POST",
            url: URL,
            data: dataString,
            cache: false
        }).done(function (html) {
            $('.spn' + ID).html(html);
        }).always(function () {
            xhr = undefined;
        });
    });
});

---

设置一个变量，我们称之为stop并切换它

$(document).ready(function () {
    var stop = false;
    $(".like").click(function () {
        if (!stop)
        {
            stop = true;
            var ID = $(this).attr("idl");
            var REL = $(this).attr("rel");
            var owner = $(this).attr("owner");
            var URL = 'box_like.php';
            var dataString = 'msg_id=' + ID + '&rel=' + REL + '&owner=' + owner;
            $.ajax({
                type: "POST",
                url: URL,
                data: dataString,
                cache: false,
                success: function (html) {
                    if (REL == 'Like') {
                        $('.blc' + ID).html('Unlike:').attr('rel', 'Unlike').attr('title', 'Unlike');
                        $('.spn' + ID).html(html);
                    } else {
                        $('.blc' + ID).attr('rel', 'Like').attr('title', 'Like').html('Like:');
                        $('.spn' + ID).html(html);
                    }
                }
            }).always(function() { stop = false; });
        }
    });
});

---

禁用您在第一行发布的单击代码中的按钮，而不是在ajax代码中成功后，重新启用成功函数末尾的按钮。@SolomonClosson我正在使用此函数中的ad success funciton？@user2800453您希望在成功中做什么？嗯，看@my question success function HTML我得到喜欢的值。从php返回file@user2800453是的，你可以补充一点：-它在我的膝盖上工作得很好。希望你在这个领域很好。非常感谢：-在这种情况下，您需要使用完整的处理程序设置stop=false，否则如果请求失败，则您将无法再次单击，直到重新加载页面并获得成功并且相同。。。您需要使用@SolomonClosson和arun p johny Bohot Achey Larkon。翻译=->非常好的男孩：-p thanq给你，伙计们，保重他们应该把名字从.done改为.success than，如果你问我的话！因为，他们有失败，为什么他们没有成功？