Question

我在jQuery中有一个ajax调用，将一些元素加载到div中。

调用有效，但由于某种原因返回重复的响应。调用应返回两个元素，但我得到4（2个正确的项目，重复一次）。

这是我的ajax电话：

$.ajax({
    url: "<?php echo site_url('feed/editor/2'); ?>",
    cache: false,
    beforeSend: function(){
        $('#feed-nav').after('<div class="loading"></div>', function(){
            $("#feeditems").fadeOut();
        });
    },
    success: function(html){
        $('#feed .loading').fadeOut('fast', function(){
            $("#feeditems").append(html).slideDown('slow');
        });
    }
});

return false;

我看不出有可能发生这种情况的原因！？

更新

我将成功函数修改为下面的代码似乎修复了它，虽然我真的不明白为什么。

success: function(html){
    $('#feed .loading').fadeOut();
    $("#feeditems").append(html).slideDown()
}

Answer 1

我认为问题是您在success回调中使用的选择器，$('#feed .loading')匹配两个元素，因此调用$("#feeditems").append(html).slideDown('slow');两次。如果您的标记包含页面加载时loading类的元素，则beforeSend回调也会添加div类loading。因此，您需要在success回调中提出不同的选择器，或者不要在loading类中使用多个div。

我在这里重现了这个问题：

http://jsfiddle.net/2PR4V/2/

您可以将此行代码添加到success回调中，以查看有多少元素匹配：

console.log($('#feed .loading').size());

我通过使用更具体的选择器解决了这个问题：

http://jsfiddle.net/2PR4V/3/

jQuery ajax调用返回双结果

1 个答案: