Question

我正在尝试将其重写为for循环;我下面的尝试失败了。有什么想法吗？

jQuery.event.add(window, "load", resizeFrame);
jQuery.event.add(window, "resize", resizeFrame);
function resizeFrame()
    if ($(window).width() < 232){
        $("#grid-content").css( 'width', '232px' );
    }else if ($(window).width() < 458){
        $("#grid-content").css( 'width', '232px' );
    }else if ($(window).width() < 684){
        $("#grid-content").css( 'width', '458px' );
    }else if ($(window).width() < 910){
        $("#grid-content").css( 'width', '684px' );
    }else if ($(window).width() < 1136){
        $("#grid-content").css( 'width', '910px' );
    };
};

结果是div（＃grid-content）在3000px左右非常宽，无论窗口大小如何。

jQuery.event.add(window, "load", resizeFrame);
jQuery.event.add(window, "resize", resizeFrame);
function resizeFrame()
    for (var x=232;x<=3000;x=x+226){
        if ($(window).width() < x ){
            $("#grid-content").css( 'width', x +'px' );
        };
    };
};

Answer 1

您不需要循环到舍入到离散步骤，这是简单的算术。

function resizeFrame() {
    var w= $(window).width();
    w-= (w-6) % 226;
    if (w<232) w= 232;
    $('#grid-content').width(w);
}

Answer 2

你需要在第一场比赛中退出循环，这样它才会一直持续到最后，如下所示：

jQuery.event.add(window, "load", resizeFrame);
jQuery.event.add(window, "resize", resizeFrame);
function resizeFrame() {
    for (x=232;x<=3000;x=x+226){
        if ($(window).width() < x ){
            $("#grid-content").css( 'width', x +'px' );
            break; //add this
        }
    }
}

你可以优化一下，比如：

jQuery(window).bind("load resize", function () {
    var w = $(window).width();
    for (var x=232;x<=3000;x+=226) {
        if (w < x ) {
            $("#grid-content").width(x);
            break;
        }
    }
});

JS如果在for循环中

2 个答案: