JQuery ajax call returns double results

I have an ajax call in jQuery loading some elements in a div.

The call works, but for some reason returns a duplicate response. The call should return two elements, but I get 4 (2 correct elements repeating once).

Here is my ajax call:

$.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;

I see no reason why this could happen !?

UPDATE

I changed the success function to the code below, which seems to have fixed it, although I really don't understand why.

success: function(html){
    $('#feed .loading').fadeOut();
    $("#feeditems").append(html).slideDown()
}
+3
source share
1 answer

, - , success, $('#feed .loading') , , $("#feeditems").append(html).slideDown('slow'); . loading , beforeSend div loading. , success div loading.

:

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

success, , :

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

, :

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

+3

All Articles