-1

我正在研究具有不同功能的项目，看起来像facebook，但是当我一次点击多次点击类似按钮或不同按钮时我被卡住了，然后它的工作就像触发一样，如果我有1或2个喜欢并且我点击了很多次快速快然后我的喜欢在-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);
                }
            }
        });
    });
});
4

2 回答 2

1

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

案例：
假设rel不一样，然后在响应再次返回之前发生另一次点击，因此rel尚未更新，因此您正在向unlike服务器发送另一个请求而不是类似请求

尝试以下解决方案（未测试）

$(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;
        });
    });
});
于 2013-10-10T02:52:49.430 回答
1

设置一个变量，我们将调用它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; });
        }
    });
});
于 2013-10-10T03:03:28.377 回答