Question

我需要根据哪个div更大来给出两个div pg-left-bar和pg-right-bar相等的高度。

我有以下jQuery代码块，你可以找到我用来检查div高度的以下代码日志。

如果pg-right-bar的高度超过pg-left-bar，如果我第一次访问该页面，如果我再次刷新或访问同一页面，那么Jquery似乎无法正常工作

我也试过在$(window).load(function () {})中调用此方法，但不会有任何不同。

我正在为我的设计使用asp.net web表单母版页。在这方面，我将不胜感激。

jQuery(document).ready(function () {
    App.init();
    App.initNavMenu();

    //Tabs
    App.InitCustomTabs();


    App.initMarqueeBrands();


    //set equal height of two div's
    //  $(".pg-right-bar").css({ "height": $("#pg-left-bar").height() })
    var leftbar = $(".pg-left-bar").height();
    var rightbar = $(".pg-right-bar").height()-4; // remove 4 pxels from righ div
    leftbar = leftbar - 20;

    if (leftbar > rightbar) {
        $(".pg-right-bar").css({ "height": $("#pg-left-bar").height() - 10 })
    }
    else {
        $(".pg-left-bar").css({ "height": $("#pg-right-bar").height() })
        $(".pg-right-bar").css({ "height": rightbar+"px" })
    }


    //activatte tooltip
    $('.tooltip').tooltipster();

});

Answer 1

嗯，我得到了你问题的一般要点，但整个问题描述都很混乱，所以我会试着帮助你解决我认为重要的问题。

var leftbar = $(".pg-left-bar").height();
var rightbar = $(".pg-right-bar").height();

if (leftbar >= rightbar) {
    $(".pg-right-bar").css({ "height": leftbar + "px" })
}else{
    $(".pg-left-bar").css({ "height": rightbar + "px" })
}

我省略了你的幻数和其他代码以使更改显而易见但我认为你的问题是由于缺少“px”连接到你的css声明的末尾。如果这不是问题，你会介意展示一个完整的例子。

Answer 2

确保App init调用都不会生成任何异常。然后试试这是否有帮助：

$(function () {
    App.init();
    App.initNavMenu();

    //Tabs
    App.InitCustomTabs();
    App.initMarqueeBrands();

    //set equal height of two div's
    var leftbar = $(".pg-left-bar :first").height() - 20;
    var rightbar = $(".pg-right-bar :first").height() - 4; // remove 4 pxels from righ div

    if (leftbar > rightbar) 
    {
        leftbar = leftbar + 10;
        $(".pg-right-bar").css({ "height": leftbar });
        $(".pg-left-bar").css({ "height": leftbar });
    }
    else 
    {
        $(".pg-left-bar").css({ "height": rightbar});
        $(".pg-right-bar").css({ "height": rightbar });
    }

    //activatte tooltip
    $('.tooltip').tooltipster();
});

JQuery函数不会在页面加载时触发它只有在刷新页面或重新访问同一页面后才能工作

2 个答案: