zoukankan      html  css  js  c++  java
  • Jquery-无法有效获取当前窗口高度

    今天碰到个很奇怪的事情,那就是滚动条往下滚动时候没有触发提示,反而是往上滚动的时候,触发了提示。百思不得其解,尤其是拿了美工大大的切图过来,一点问题都没有。

    那么就进行console.log输出查看了。图一是异常的,图二正常的。按理windowHeight获取到的值应该如图二中的667而不是763,scrollHeight也不会是763而是在变化的。

                  图1

                  图2

    <script>
            $(window).scroll(function () {
                var scrollTop = $(this).scrollTop();
                var scrollHeight = $(document).height();
                var windowHeight = $(window).height();
                console.log("scrollTop:" + scrollTop)
                console.log("windowHeight:" + windowHeight)
                console.log("scrollHeight:" + scrollHeight)
                if (scrollTop + windowHeight == scrollHeight) {
                    alert(1)
                    //getNextCollection();//加载
                }
            });
        </script>
    

    因为无法解释这个问题,就百度了

     查到的一个文档:

    http://blog.csdn.net/playboyanta123/article/details/40054645 

    以下为文档内容:

    $(window).height()     获取的是当前可视窗口的高度,也就是用户能看到的窗口的高度,是不变的(在窗口大小不变的前提下)
    $(document).height()  获取的是窗口内文档的高度,这个高度随着文档内容的高度改变而改变

    当窗口滚动条滚到最低端时,$(document).height() == $(window).height() + $(window).scrollTop()。
    当窗口内文档高度不足浏览器窗口高度时,$(document).height()返回的是$(window).height()。

    $("body").height()   如果body没有border、margin的话,$("body").height()==$(document).height(),但是还是不建议使用这种方式去获取文档内容高度

    PS:如果你发现$(window).height()值有问题,返回的不是浏览器窗口的高度,那么看看是不是网页没有加上<!DOCTYPE>声明。
    如果没加的话网页会进入怪异模式,你懂的!

    ========================================================分割线=====================================================

    那么造成这样怪异的原因就是,没有在头部添加<!DOCTYPE>声明。

    这个声明一般创建的时候都有的好像。

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

  • 相关阅读:
    hdu 2544 单源最短路问题 dijkstra+堆优化模板
    CImg、libjpeg--介绍、配置(操作JPEG)
    【Android归纳】开发中应该注意的事项
    iOS測试——置换測试: Mock, Stub 和其它
    <html>
    系统吞吐量、TPS(QPS)、用户并发量、性能測试概念和公式
    hdu 1038 Biker&#39;s Trip Odometer(水题)
    java泛型
    从头认识Spring-2.1 自己主动装配(2)-byType(2)
    11.2.0.3 RAC(VCS)节点crash以及hang的问题分析
  • 原文地址:https://www.cnblogs.com/danlis/p/7081349.html
Copyright © 2011-2022 走看看