判断滚动条到底部，需要用到DOM的三个属性值，即scrollTop、clientHeight、scrollHeight。
scrollTop为滚动条在Y轴上的滚动距离。
clientHeight为内容可视区域的高度。
scrollHeight为内容可视区域的高度加上溢出（滚动）的距离。
从这个三个属性的介绍就可以看出来，滚动条到底部的条件即为scrollTop + clientHeight == scrollHeight。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>JS Bin</title> <script src="https://code.jquery.com/jquery-3.1.0.js"></script> <style> #box { width: 100px; height: 100px; background: pink; } </style> </head> <body> <div id="box"></div> <p>123</p><p>123</p><p>123</p><p>123</p><p>123</p><p>123</p><p>123</p> <p>123</p><p>123</p><p>123</p><p>123</p><p>123</p><p>123</p><p>123</p> <p>123</p><p>123</p><p>123</p><p>123</p><p>123</p><p>123</p><p>123</p> <p>123</p><p>123</p><p>123</p><p>123</p><p>123</p><p>123</p><p>123</p> <p>123</p><p>123</p><p>123</p><p>123</p><p>123</p><p>123</p><p>123</p> <script> // $(window).scrollTop() 在Y轴上滚动的高度 // $(window).height() 当前窗口可见高度 // $(document).height() 可视区域高度+滚动溢出的高度 $(window).scroll(function () { var scrollTop = $(this).scrollTop(); var clientHeight = $(this).height(); var scrollHeight = $(document).height(); if(scrollTop + clientHeight == scrollHeight) { alert('滚动到底部'); } }); </script> </body> </html>