在ajax请求后完全加载后淡入图像

Question

我的主要目标是将一个相当大的图像加载到我的#pictureframe div并淡化加载的图像。

以下代码运行良好，但问题是正在加载的图像没有按预期方式淡入。

我的html页面是

<div id="picture">

    <div id="pictureframe">
    </div>

</div>

我的Java脚本功能如下

$('#content').on('click',".lstimages .imgthumb",(function(){


    var photoid = $(this).attr('alt');

    $.ajax({
    dataType: "json",
    url: '/ajax/pictureview/load/' + photoid,
    success: loadImg
    ,
    error: function (xhr, ajaxOptions, thrownError) {
    alert(xhr.status);
    alert(thrownError);
    }
    });


    }));


    function loadImg(data)
    {

        $('#picture > #pictureframe').hide().html("<img alt='"+ data[0].pictureid +"' src='"+ data[0].filepath + "'>").fadeIn();


    }

Answer 1

如果找到答案

$('#picture > #pictureframe').hide().html("<img alt='"+ data[0].pictureid +"' src='"+ data[0].filepath + "'>");


$('#picture > #pictureframe img').bind("load", function() {
        $('#picture > #pictureframe').fadeIn();  
});