Question

我有以下功能可以获取超出默认情况下显示的20条

的更多注释

$('.more_comments_link').live('click', function() {
        $(".more_comments_link").text("Fetching More Comments ...");

        var ajaxOpts = {
            type: "get",
            url: "ajax_getcomments.php",
            dataType: 'json',
            data: "&itemid=<? echo $id; ?>&type=1&owner=<? echo $event["data"]["e_creator"]; ?>&more=1",
            success: function(data) {
                $('.discussion-more').after(data);
                $(".discussion-more").hide();
            }
        };

        $.ajax(ajaxOpts);
        return false;
    });

它的工作原理，唯一的问题是，用户可以非常快速地点击按钮3次，并且它会向ajax_getcomments.php发送3个请求，每次都获得相同的结果集。

我尝试添加

$(".more_comments_link").unbind('click');

但它没有做任何事情。

初始结果集也是使用jquery获取的，因此我使用.live(click'

不确定它是否与它无法正常工作有关。

Answer 1

live不适用于unbind - 您需要die代替。

然而有更好的解决方案。由于您可能希望能够多次更新内容，因此可以设置变量以查看当前是否正在运行请求：

var requestRunning = false;
$('.more_comments_link').live('click', function () {
    if (requestRunning) { // don't do anything if an AJAX request is pending
        return;
    }

    $(".more_comments_link").text("Fetching More Comments ...");

    var ajaxOpts = {
        type: "get",
        url: "ajax_getcomments.php",
        dataType: 'json',
        data: "&itemid=<? echo $id; ?>&type=1&owner=<? echo $event["
        data "]["
        e_creator "]; ?>&more=1",
        success: function (data) {
            $('.discussion-more').after(data);
            $(".discussion-more").hide();
        },
        complete: function() {
            requestRunning = false;
        }

    };

    requestRunning = true;
    $.ajax(ajaxOpts);
    return false;
});

Answer 2

对于一个非常简单的解决方案，所有这些解决方案都非常复杂;根据以下文档使用.one（）：

http://api.jquery.com/one/

只需将live更改为one即可。见下文：

$('.more_comments_link').one('click', function() {

Answer 3

您可以使用.die()取消绑定.live()个事件。

live
die

或者在其他位置设置一个标记，表示请求正在进行中，并在点击处理程序的开头检查。

Answer 4

尝试使用disabled关键字。这样您就不必取消绑定该功能，只需将其禁用即可：

$('.more_comments_link').live('click', function() {
    $(this).attr("disabled", true);
    $(".more_comments_link").text("Fetching More Comments ...");

    var ajaxOpts = {
        type: "get",
        url: "ajax_getcomments.php",
        dataType: 'json',
        data: "&itemid=<? echo $id; ?>&type=1&owner=<? echo $event["data"]["e_creator"]; ?>&more=1",
        success: function(data) {
            $('.discussion-more').after(data);
            $(".discussion-more").hide();
        }
    };

    $.ajax(ajaxOpts);
    return false;
});

Answer 5

根据您的使用情况，您可能不必使用live，在这种情况下one可以完全按照您的意愿执行。

Answer 6

您可以使用：

$('element').off()

这将禁用您正在侦听的组件的任何事件

Answer 7

$('.more_comments_link').live('click', function(e) {

    if($(e.target).data('oneclicked')!='yes') {

        $(this).text("Fetching More Comments ...");

        var ajaxOpts = {
            type: "get",
            url: "ajax_getcomments.php",
            dataType: 'json',
            data: "&itemid=<? echo $id; ?>&type=1&owner=<? echo $event["data"]["e_creator"]; ?>&more=1",
            success: function(data) {
                $('.discussion-more').after(data);
                $(".discussion-more").hide();
            }
        };

        $.ajax(ajaxOpts);
        return false;
    }

    $(e.target).data('oneclicked','yes');

});

Answer 8

对我来说这很有效：

$('.more_comments_link').live('click', function() {

if(e.handled !== true) // This will prevent event firing more than one time
{
  e.handled = true;
  //your code here...
}

});

Answer 9

我的解决方案，在所有ajax请求上全局工作，如果是活动请求，则使用相同网址的新内容将被中止。工作正常。

var activeRequests = [];

$(document).ajaxComplete(function(e, jqxhr, settings) {
    var i = activeRequests.indexOf(settings.url);
    if (i != -1) {

    setTimeout(function(){ activeRequests.splice(activeRequests.indexOf(settings.url), 1); }, 75);

}
});

$(document).ajaxSend(function(e, jqxhr, settings) {
var i = activeRequests.indexOf(settings.url)
if (i != -1) {
    jqxhr.abort();
    activeRequests.push(settings.url);
}
});

单击1后禁用jquery功能，以防止多次执行

9 个答案: