即使浏览器窗口改变大小，jQuery 也能找出元素宽度

Question

我有以下 jQuery 代码，它可以找出容器的宽度，然后告诉子元素具有一定的大小(减去侧边栏的大小)，以便它将填充屏幕。

它工作正常，除了当用户更改浏览器窗口时它不会更新!所以我需要 jQuery 代码来实时工作。有人可以帮忙吗？谢谢

$(document).ready(function () {

    // find out the width of the page
    var pageWidth = $('div.MainContentHolder').width();
    // minus the sidebar and margin width
    var middleWidth = pageWidth - '220';
    // apply the new width to the middle column
    $('div.MiddleColumn').css('width', middleWidth);

});

Answer 1

您只需将其绑定(bind)到 $(window).resize();

$(document).ready(function () {

    $(window).resize(function() {
        // find out the width of the page
        var pageWidth = $('div.MainContentHolder').width();
        // minus the sidebar and margin width
        var middleWidth = pageWidth - '220';
        // apply the new width to the middle column
        $('div.MiddleColumn').css('width', middleWidth);
    }).resize();

});