Question

我在$(document).ready(function(){});包含以下代码：

var sizeMapContainer = function(n) {
    var w = $(window).innerHeight();
    var h = $('#sl-header-container').outerHeight();
    var f = $('.oev-form-container').outerHeight();
    var m = w - h - f;
   $('#map-container').outerHeight(m);
}
sizeMapContainer(1);
$(window).on('resize', sizeMapContainer(2));

为什么sizeMapContainer会在页面加载时被调用两次，而不是在我调整窗口大小时调用它？

Answer 1

您正在调用该函数，而不是将事件绑定到该函数。它应该是：

$(window).on('resize', function() {
    sizeMapContainer(2);
});

Answer 2

这是问题的一行

$(window).on('resize', sizeMapContainer(2));

'on'的第二个参数是一个在'resize'事件发生时运行的函数。它不期望最后用你的（2）跟注。它正在运行你的函数sizeMapContainer（），而不是让'resize'事件决定它何时发生。如果删除（2），则在调整大小时会触发sizeMapContainer（）函数。

function myName(){
    return "Aaron";
}

console.log( myName ); //gives you the function itself
console.log( myName() ); //gives you Aaron

所以他所做的就是创建一个匿名函数来运行你的函数并为你传递参数。

希望有助于澄清事情。

为什么在加载时触发（'resize'）事件，而不是在窗口调整大小？

2 个答案: