Question

我具有此功能来调整页面，以使它无论设备如何都不会滚动，它完全可以工作，但是，当您旋转屏幕或当我更改设备以检查Google Chrome时，该功能不起作用好吧，只有在可以正常工作的页面上进行重新加载时，我才不知道自己在做什么错。我相信问题出在变量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');

这些不选择任何元素。它们是类选择器还是ID选择器？我将为示例使用类选择器。

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);
};

我在这里看到的另一个问题是，这没有捕获任何填充或边距。最好包括显示HTML和CSS的Minimal, Reproducible Example。

jQuery函数无法正常工作，只是重新加载

1 个答案: