php - JQuery AJAX 淡入内容

Question

可能重复：
使我的 ajax 更新的 div 淡入

我希望 AJAX 调用的内容出现fadeIn在我的页面上，但是当我使用此代码$('#sub_container').html(content).fadeIn();时它不起作用，即使我将动画速度设置为超慢（slow(5000)）

$('.create').click(function(){
    loadingimg();
    document.title = 'Create Message';
    $.ajax({
        url: 'create.php',
        dataType: 'html',
        success: function(content){
            $('#sub_container').html(content);
            // $('#sub_container').html(content).fadeIn(); <- Fails
        }
    });
});

Answer 1

该函数本质上使元素可见，因此如果元素已经.fadeIn()可见，则似乎什么也不做。您可以通过隐藏元素来确保不是这种情况：

$('#sub_container').hide().html(content).fadeIn();

Answer 2

您需要确保它一开始是隐藏的，例如：

$('.create').click(function(){
$('#sub_container').fadeOut();    // fade out the current content
loadingimg();
document.title = 'Create Message';
$.ajax({
    url: 'create.php',
    dataType: 'html',
    success: function(content){
        $('#sub_container').html(content).stop().fadeIn();    // fade in the new content
    }
});
});

但这会让你在元素消失时跳转内容，所以如果有必要，你必须考虑到这一点。