javascript - $(窗口).resize();不起作用

Question

我遇到了 window.resize 问题。我的代码 js/jquery 在这里

var x = $(window).width();
var y = $(window).height();
var z = $('#card').height();
var a = z + 140; // !!!zmienic gdy zmiana marginesu z gory lub paddingu (100 margin + 20x2 padding)
var b = 1.78 * y;
var c = 1.78 * a;
function updateBodySize(){
    x = $(window).width();
    y = $(window).height();
    z = $('#card').height();
    a = z + 140; // !!!zmienic gdy zmiana marginesu z gory lub paddingu (100 margin + 20x2 padding)
    b = 1.78 * y;
    c = 1.78 * a;
    if (c>b) {
        if (x>c) {
            $('body').css({'background-size': x + 'px auto'});
        }
        else {
            $('body').css({'background-size': 'auto ' + c + 'px'});
        }
        $('body').css({'height': a + 'px'});
    }
    else {
        if (x>b) {
            $('body').css({'background-size': x + 'px auto'});
        }
        else {
            $('body').css({'background-size': 'auto ' + b + 'px'});
        }
        $('body').css({'height': y + 'px'});
    }
}
$(document).ready(updateBodySize()); //kiedy zaladowany
$(window).resize(updateBodySize());  //kiedy zmiana rozmiaru

评论是波兰语的，但并不重要。我想在每次调整浏览器大小时运行函数 updateBodySize，但现在此函数仅在文档准备好时运行(所以我知道该函数工作正常)(最后一行，但一行)，并且看起来最后一行被忽略。这行$(window).resize(updateBodySize());是错误的吗？或者我的功能有问题吗？我在 Chrome 33 中检查了这段代码。

Answer 1

你的最后两行似乎是这里的问题:

$(document).ready( updateBodySize() );
$(window).resize( updateBodySize() );

应该是:

$(document).ready( updateBodySize );
$(window).resize( updateBodySize );

请注意从 updateBodySize 中删除 () - 您的目标是将 函数 updateBodySize 传递给.ready 和 .resize，而不是其结果。通过调用该函数，您所做的是将 updateBodySize() 的结果传递给 .ready 和 .resize 函数，在效果:

$(document).ready( null );
$(window).resize( null );

正如您所注意到的，除了您第一次(两次)调用它时 updateBodySize() 所做的事情之外，它什么也不做。删除 ()，它将被视为您期望的事件处理程序。

PS:

除非您使用的是第一个 block

var x = $(window).width();
var y = $(window).height();
var z = $('#card').height();
var a = z + 140;
var b = 1.78 * y;
var c = 1.78 * a;

在函数 block 之前，您可以删除它，因为您在函数内部重新定义了这些变量，因此每次调用时它都会独立计算它们。