-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 リクエストの非同期の性質によるものです....要素を連続してクリックすると...前のリクエストからのレスポンスが戻ってくる前にクリックイベントが発生し、リンクステータスが次のものに更新されます

ケース:が異なると
仮定する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 に答える