jQuery function 不工作只是重新加載

Question

我有這個 function 來調整頁面，使其無論設備如何都不會滾動，它完全可以工作，但是，當您旋轉屏幕或更改設備以檢查 Google Chrome 時，function 不能正常工作，只有如果我在有效的頁面上重新加載，我不知道我做錯了什么。 我相信問題出在變量 h 中，它在其中獲取高度，在修改或旋轉設備時不會獲取高度，但我不確定，我已經嘗試了一切

function changeSize() {
  let h = $(document).height();
  let he = $("header").height();
  let m = $("main").height();
  let f = $("footer").height();
  let l = $("ui-loader").height();
  let x = h - he - m - f - l;
  $("container").css('height', x + 'px');
}

$(document).ready(function() {
  changeSize();
  $(window).resize(function() {
    changeSize();
  });
};

Answer 1

我看到的第一個問題在這里：

  let he = $("header").height();
  let m = $("main").height();
  let f = $("footer").height();
  let l = $("ui-loader").height();
  $("container").css('height', x + 'px');

這些不 select 任何元素。 它們是 Class 選擇器還是 ID 選擇器？ 我將為我的示例假設 Class 選擇器。

function changeSize() {
  let h = $(document).height();
  let he = $(".header").height();
  let m = $(".main").height();
  let f = $(".footer").height();
  let l = $(".ui-loader").height();
  let x = h - he - m - f - l;
  $(".container").css('height', x + 'px');
}

$(function() {
  changeSize();
  $(window).on("resize deviceorientation", changeSize);
};

我在這里看到的另一個問題是這不會捕獲任何填充或邊距。