jQuery AJAX使用fadeIn + replaceWith [英] jQuery AJAX using fadeIn + replaceWith

问题描述

有几个问与答；一个是关于这个的，但我发现没有一个能解决我的问题.我为此感到难过.如果您知道对此的可用答案，请重定向至链接.

我的页面上有一个空的DIV #posts_insert，其中通过Ajax插入了新帖子.

    $.ajax({
        url: 'chat/posts_submit/' + <?php echo $page_id; ?>,
        type: 'POST',
        data: $('#posts_form').serialize(),
        dataType: 'html',
        success: function(html) {
            $('#posts_insert').replaceWith(html);
        }
    });

我希望新帖子淡出，以取代#posts_insert.我在success之前尝试使用hide()在success上进行了几次迭代，但是我无法完成这项工作.

任何想法如何解决这个问题?预先感谢.

解决方案

怎么样:

$("#posts_insert").replaceWith(function() {
    return $(html).hide().fadeIn();
});

这是一个工作示例: http://jsfiddle.net/andrewwhitaker/jTLn5/

There are several q & a's on SO on this but I found none that address my issue. And I'm stumped with this. Please redirect me to a link if you know of an available answer to this.

My page has an empty DIV #posts_insert in which new posts are inserted via Ajax.

    $.ajax({
        url: 'chat/posts_submit/' + <?php echo $page_id; ?>,
        type: 'POST',
        data: $('#posts_form').serialize(),
        dataType: 'html',
        success: function(html) {
            $('#posts_insert').replaceWith(html);
        }
    });

I want that new post to fade in, replacing #posts_insert. I've tried several iterations on success using hide()prior to fadeIn but I just can't make this work.

Any ideas how to solve this? Thanks in advance.

解决方案

How about:

$("#posts_insert").replaceWith(function() {
    return $(html).hide().fadeIn();
});

Here's a working example: http://jsfiddle.net/andrewwhitaker/jTLn5/

这篇关于jQuery AJAX使用fadeIn + replaceWith的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！