Question

我真的不明白如何在文档就绪时正确调用Javascript函数。我的目标是根据浏览器窗口的高度调整div的大小，并从SO上的另一个答案中获取此代码。我做错了什么？

function resizeElementHeight(element) {
  var height = 0;
  var body = window.document.body;
  if (window.innerHeight) {
      height = window.innerHeight;
  } else if (body.parentElement.clientHeight) {
      height = body.parentElement.clientHeight;
  } else if (body && body.clientHeight) {
      height = body.clientHeight;
  }
  element.style.height = ((height - element.offsetTop) + "px");
}

$(document).ready(resizeElementHeight($('#global_image')));

我试图调用的元素具有id“global_image”，但是我得到“无法设置未定义的属性高度”，并且我觉得如何为函数提供正确的元素感到迷茫。谢谢你的帮助！

Answer 1

ready()期望函数作为其参数。现在，您正在调用resizeElementHeight()并将其返回值传递给ready()。

在您当前的代码中，在调用resizeElementHeight()时，DOM尚未就绪，元素#global_image尚未在DOM树中。

您应将其更改为：

$(document).ready(function() {
    resizeElementHeight($('#global_image'));
});

Answer 2

函数resizeElementHeight需要DOM元素，而不是JavaScript对象。要扩展techfoobar的答案，您应该将其更改为：

$(document).ready(function() {
    resizeElementHeight($('#global_image')[0]);
});

Answer 3

当您通过以下方式调用resizeElementHeight.replace时，DOM对象未完全加载：

    $(document).ready(function() {
    resizeElementHeight($('#global_image')[0]);
});

Javascript - 如何正确调用函数

3 个答案: