Question

我尝试使用JQuery来检测我的网页内容何时被加载，然后根据内容的大小调整页面上的div（导航栏和内容）的大小。（例如，如果有少量文本，则div的高度为800px，但当导航和内容div的高度不同时，则设置两者都等于两者的最大高度。

        function resizePage(){
            var defaultSize = 600;
            var sidebarH = $("nav").height();
            var articleH = $("article").height();

            if((sidebarH < defaultSize) || (articleH < defaultSize)){
                $("nav").css({'height': defaultSize});
                $("article").css({'height': defaultSize});
            }
            else{
                if(sidebarH <= articleH){
                    $("nav").css({'height': articleH});
                }
                else{
                    $("article").css({'height': sidebarH});
                }
            }
        }

        $(window).load(function() {
            resizePage();
        });

当我修改html代码时...现在使用Jinja模板......似乎在加载窗口后加载了模板数据，因此它没有正确调整大小。有没有一种方法可以告诉JQuery何时加载模板数据？或者我可以用不同的方式解决这个问题吗？

谢谢你的时间！

Answer 1

请尝试.ready()：

$(document).ready(function() {
    function resizePage() {
        var defaultSize = 600;
        var sidebarH = $("nav").height();
        var articleH = $("article").height();

        if((sidebarH < defaultSize) || (articleH < defaultSize)) {
            $("nav").css({'height': defaultSize});
            $("article").css({'height': defaultSize});
        }
        else{
            if(sidebarH <= articleH){
                $("nav").css({'height': articleH});
            }
            else{
                $("article").css({'height': sidebarH});
            }
        }
    }      

    resizePage(); // You are calling it here
});

Answer 2

只需改变||到＆amp;＆amp;。

$（window）.load与$（document）.ready在这里没什么区别。

JQuery $（window）.load与Jinja模板无法正常工作

2 个答案: