13

我在 $(window).height() 上做一个简单的测试，我在 1366 x 768 的屏幕分辨率上得到了 2602 的值。

jQuery(document).ready(function($){

    var W = $(window).width();
    var H = $(window).height();

    console.log('W ' + W);
    console.log('H ' + H);

}

输出：

W 1226 H 2602

关于如何调试这个或我做错了什么的任何提示？

编辑：使用 chrome 和 FF

我实际上是在控制台中输入这个：jQuery(window).height();

4

6 回答 6

10

这可能就像缺少或不正确的 DOCTYPE 一样简单（受影响的 Chrome 但不影响 IE）。

有趣的是，这甚至不是 jQuery 问题——它也有影响document.documentElement.clientHeight。

没有文档类型：

在此处输入图像描述

使用文档类型：

<!DOCTYPE html>

在此处输入图像描述

我以为我的页面上有一个布局模板，但事实证明我没有 - 因此没有 DOCTYPE。

于 2014-08-12T21:42:01.890 回答
5

你做的一切都是正确的，你没有得到你应该得到的价值观。这不是 jQuery 应该表现的方式。

在这一页中，我测试了您调用的函数以查看它们的值。它们确实准确地代表了我窗口中可见页面的实际宽度和高度。这是结果。

Chrome，带有标准的开发控制台

jQuery中对窗口宽度和高度的一些调用，返回屏幕上像素的正确结果

Firefox，带有 Firebug

jQuery中对窗口宽度和高度的一些调用，返回屏幕上像素的正确结果

你那边出了点问题

jQuery$(window).height()应该显示可见的视口。请参阅有关jQuery 高度函数的文档：

此方法还能够找到窗口和文档的高度。

$(window).height(); // returns height of browser viewport
$(document).height(); // returns height of HTML document

window.height是事物可以干扰的可设置值，但$(window).height()不受对其更改的影响。

究竟出了什么问题？

无论发生什么，无论你调用什么函数，你都没有调用 jQuery 的$(window).height().

使用浏览器的开发人员控制台，在您调用的行上放置一个断点$(window).height()并单步执行函数调用。当你打电话的时候实际上是在叫什么$(window).height()？你需要找出这个。

有人用新的或更好的函数替换了高度函数吗？

我的一个强烈怀疑是你正在使用的代码库的某些部分已经完成了这个：

// Replace jQuery's height function with a better one to fix bug XYZ
$(window).height = function brandNewHeightFunction() {
    return someVeryWrongValue;
};

如果是这样，当你进入高度函数时，它实际上可能不是进入了jQuery库的一部分，而是你自己的库的另一部分。找出它的必要性，看看你能做些什么。如果您只是删除此功能，则依赖于它以这种方式工作的其他东西可能会开始破坏。

有人去修改/定制了你的 jQuery 库吗？

尽可能检查是否发生了这种情况，以及任何可用的历史工具。您使用的是什么版本的 jQuery？如果可能，从 jQuery 站点下载相同的代码，并查看当您进入窗口高度函数时看到的代码与您在此处看到的代码相同。

重新下载 jQuery 并引用它。如果您的窗口高度功能突然开始工作，则可能有人这样做了。找出为什么这是定制的。如果您对其进行修复，则取决于此行为的其他东西可能会开始损坏。

于 2013-08-12T03:05:58.690 回答
1

实际上，这是我页面上隐藏 div 元素的结果。我有一个厚框链接，可以拉出这些隐藏的内容。删除这个修复了 jQuery.width()！

令人惊讶，不确定是否有帮助，但确实是答案。

于 2013-08-26T15:59:01.750 回答
1

同样的问题，看起来 jquery（和一般的 dom）在 quirksmode 中没有正确计算大小。

两种解决方案：

  1. 在页面顶部添加 doctype html，或者
  2. 如果第一个选项不是选项，请使用 window.innerHeight、window.innerWidth。

希望能帮助到你。

于 2015-08-13T02:52:25.413 回答
0

在大多数情况下，我的经验$(document).height();通常是您想要的。不同之处在于如果页面大于窗口（有滚动条），您将获得整个可滚动文档的完整高度，而$(window).height()只会获得当前大小的选项卡的高度。

因此，如果您希望元素占据窗口的整个大小 + 折叠下方的任何可滚动区域都是可行$(document).height的方法。

不过，两者肯定都有用例。

于 2018-01-31T20:51:33.083 回答
-1

jquery 使用 clientWidth 和 height 返回当前显示页面的值，不包括滚动条空间有一种方法可以使它准确溢出：隐藏到你的 body 标签然后你会得到原始的视口大小

于 2016-02-05T20:24:05.707 回答