从ajax更新div内容时闪烁和闪烁

Question

我从服务器获取数据。数据包含许多图像和一些其他html元素。当用服务器响应替换div的内容时，它总是在div内闪烁。

$('#div').html(serverResponse);

我也遵循了这个方法：How to avoid blinking when updating page from ajax但仍然闪烁

如何防止闪烁。

Answer 1

您可以先隐藏'#div'并等待所有images加载，然后显示'#div'。

$.ajax({
    url: '',
    success: function (serverResponse) {
        $('#div').html(serverResponse).hide();

        var $imgs = $('#div img'), //all images inside '#div'
            len = $imgs.length, 
            imgs_loaded = 0;

        $imgs.load(function(){
            imgs_loaded++;
            if(imgs_loaded == len){
                $('#div').show();
            }
        });
    }
});