Question

$("#classesLink").click(function(event) {
    $("#globalUserContent").children().slideUp("normal", function() {
        $.ajax({
            type: "POST",
            url: "classes.php?token="+randString+"",
            success: function (msg) {
                $("#globalUserContent").html(msg);
            },
            error: function (msg) {
                $("#globalUserContent").html(msg);
            }
        });            
    });
    return false;
});

我有上面的代码，当我点击.classesLink按钮并查看firebug请求时，它显示它已被提交两次，是否有任何问题？

Answer 1

此...

$("#globalUserContent").children()

...可能匹配2个元素，因此处理程序会触发两次。

您可以使用setTimeout代替。

$("#globalUserContent").children().slideUp("normal");

setTimeout(function() {
        $.ajax({
            type: "POST",
            url: "classes.php?token="+randString+"",
            success: function (msg) {
                $("#globalUserContent").html(msg);
            },
            error: function (msg) {
                $("#globalUserContent").html(msg);
            }
        });
}, 600);

Answer 2

正如@am所说，不是我。 $("#globalUserContent")有两个孩子，所以回调会为每个孩子发射两次，使用它：

$("#classesLink").click(function(event) {
    $.when($("#globalUserContent").children().slideUp("normal"))
     .then(function() {
        $.ajax({
            type: "POST",
            url: "classes.php?token="+randString+"",
            success: function (msg) {
                $("#globalUserContent").html(msg);
            },
            error: function (msg) {
                $("#globalUserContent").html(msg);
            }
        });            
    });
    return false;
});

这将在slideUp效果完成时执行callback-ajax requst，并且不会对代码中的setTimeout延迟进行硬编码。

如果您在代码中对600进行硬编码，那么如果"normal"持续时间某天会发生变化，或者有人更改slideUp持续时间效果但未更改超时，则代码可能会中断延迟。

但你可以把持续时间延迟放在一个变量中，这样你就可以在一个地方改变它 - @ am不是我的建议。

when docs：

描述：提供一种基于一个或多个对象执行回调函数的方法，通常是表示异步事件的Deferred对象。

jQuery请求提交两次

2 个答案: