Javascript 如何检测jquery中文档大小的变化
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5532453/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
how to detect document size change in jquery
提问by kamikaze_pilot
so suppose that clicking something would lead to a new content being loaded to the screen hence the height of document changes and whereas previously there are no scroll bars, now there actually are scrollbars...
所以假设点击某物会导致一个新的内容被加载到屏幕上，因此文档的高度会发生变化，而以前没有滚动条，现在实际上有滚动条......
how do I detect something like that happening using jquery
我如何使用 jquery 检测类似的事情发生
binding resize event onto window only detects window resize whereas binding it into document doesn't work
将调整大小事件绑定到窗口仅检测窗口调整大小，而将其绑定到文档中不起作用
回答by buschtoens
Update:
Please don't use the DOMSubtreeModifiedevent. It is old, deprecated and not well-supported by browsers. In 99,9 % of the cases, there is a different event you can listen on. Most likely you are one of those people using jQuery and doing some AJAX stuff, so please take a look at their AJAX docs.
更新：
请不要使用该DOMSubtreeModified事件。它是旧的，已弃用，并且不受浏览器的良好支持。在 99.9% 的情况下，您可以收听不同的事件。您很可能是使用 jQuery 并使用 AJAX 的人之一，因此请查看他们的AJAX 文档。
Theseare all available events. You would have to detect $(document).bind('DOMSubtreeModified', function() { ... });and check for a dimension change to the previous firing.
这些都是可用的事件。您必须检测$(document).bind('DOMSubtreeModified', function() { ... });并检查上一次点火的尺寸变化。
var height = $(this).height(),
width = $(this).width();
$(document).bind('DOMSubtreeModified', function() {
if($(this).height() != height || $(this).width() != width) {
recalibrate();
}
});
This event is firing everytime anythingis done to the DOM. Therefore it willslowdown your browser.
每次对 DOM 执行任何操作时都会触发此事件。因此，它会减慢您的浏览器的速度。
We should get a better alternative. Could you please give us more information to your scenario?
我们应该得到更好的选择。您能否为我们提供更多关于您的场景的信息？
回答by Nathan Sharfi
Here is the solution.
这是解决方案。
// ajdust margins when page size changes (ie rotate mobile device)
$(window).resize(function() {
// Do something more useful
console.log('doc height is ' + $(window).height());
});
回答by Sam
You could try a percentage scrolled event like this one: http://www.jquery4u.com/snippets/jquery-detect-scrolled-page/
您可以尝试像这样的百分比滚动事件：http: //www.jquery4u.com/snippets/jquery-detect-scrolled-page/
You might need to add a check to see whether the vertical scrollbar is present:
您可能需要添加检查以查看是否存在垂直滚动条：
var hasVScroll = document.body.scrollHeight > document.body.clientHeight;
