javascript - $(document).height 第一次返回错误高度，第二次更正

Question

我正在尝试放置一个弹出屏幕，并且我想在弹出窗口打开时使背景变暗。这是 JavaScript。

$(document).on('click', '.item', function(){
        $("#popUp").css("display" , "block");
        var divId = $(this).attr("id");
        $.get('portfolio/portfolio.xml', function(file){
            $(file).find('item').filter(function() {return $(this).attr("id") == divId;}).each(function(){
                var $item = $(this);
                var name = $item.find("name");
                var description = $item.find('description'); 
                $("#popUpName").html(name.text()) ;
                $("#popUpDescription").html(description.text());
                var im; var n=0;
                $item.find('image').each(function() {
                    var i = "<img src='" + $(this).text() + "'></img>";
                    i += "<div>" + $(this).attr("description") + "</div>";
                    $("#popUpImage").append(i);
                });
                setPopUpHeight();
                $(document).scrollTop(0);
            });
        }); 
    });

    function setPopUpHeight() {
            //alert($(document).height());
            $("#popUp").height($(document).height());
            alert($("#popUp").height());
    }

例如:在一种情况下，第一次该值为 3701，第二次为 4196。

编辑:$(document).height，从 $(window).height 更改。
编辑:我应该补充一点，如果取消注释第一个警报，则第二次 document.height 返回正确的值。

Answer 1

将 $(document).height() 替换为 $(window).height()。

还移动了 SetPopUpHeight() 和 scrollTop() 调用，这些调用无需每个 'item' 调用一次。

$(document).on('click', '.item', function(){
        $("#popUp").css("display" , "block");
        var divId = $(this).attr("id");
        $.get('portfolio/portfolio.xml', function(file){
            $(file).find('item').filter(function() {return $(this).attr("id") == divId;}).each(function(){
                var $item = $(this);
                var name = $item.find("name");
                var description = $item.find('description'); 
                $("#popUpName").html(name.text()) ;
                $("#popUpDescription").html(description.text());
                var im; var n=0;
                $item.find('image').each(function() {
                    var i = "<img src='" + $(this).text() + "'></img>";
                    i += "<div>" + $(this).attr("description") + "</div>";
                    $("#popUpImage").append(i);
                });
            });
            setPopUpHeight();
            $(document).scrollTop(0);
        }); 
    });

    function setPopUpHeight() {
            //alert($(document).height());
            $("#popUp").height($(window).height());
            alert($("#popUp").height());
    }