Question

我创建了一个函数来评估每个部分的宽度，将它们相加，然后将容器宽度设置为所有子部分的总和。这适用于页面加载，但不适用于调整大小。代码如下：

var sunWidth = 0;

function sizePanels(){
    var sections = $("section");

    sections.each(function(){

        var totalWidth = 0,
        select = $(this).find('.mainScroll div');

        //we loop through all child content within a section and sum it's widths
        select.each(function(index) {
            totalWidth += parseInt($(this).outerWidth(true), 10);
        });

        //here we add up all of the section widths so we can set a master width for the container
        sunWidth += parseInt(totalWidth, 10);

        //we set the width of each section
        $(this).css({ 'width' : totalWidth});

        //now we set the width of the container
        //this works great on page load, but not on resize! HERE IS THE PROBLEM
        $("#sectionWrap").css({'width' : sunWidth});

    });

}

sizePanels();
$(window).resize(sizePanels);

就像我说的，这个功能很适合页面加载。但是在窗口调整大小时，$("sectionWrap")的宽度呈指数增长。我如何计算sunWidth一定有问题。知道如何解决这个问题吗？

Answer 1

您确实只声明了sunWidth一次并将其初始化为零，但每次调用sizePanels时都会继续添加它。它应该是

function sizePanels(){
    var sunWidth = 0; // reset!
    $("section").each(…

在每个循环中累加值的总和

1 个答案: