Javascript 使用jquery获取垂直滚动的最大值
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/6027278/
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
getting the maximum value of vertical scroll using jquery
提问by kamiar3001
This is my view code I used jquery it works and I didn't have any problem until I have changed the screen resolution it stops working. I know where is the problem but I can't solve it look at the code :
这是我使用 jquery 的视图代码,它可以工作,直到我更改了它停止工作的屏幕分辨率后,我才遇到任何问题。我知道问题出在哪里,但我无法解决它,请查看代码:
@model PNUBOOKIR.Models.ProductModels
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<title>Index</title>
<script src="@Url.Content("~/Scripts/jquery.js")" type="text/javascript"></script>
<script type="text/javascript">
var endRun = false;
var PageNO = 1;
$(window).scroll(function () {
if ((($("#container").outerHeight() - 796) == ($(this).scrollTop())) && (!endRun)) {
endRun = true;
Load();
}
});
$(document).ready(function () {
Load();
return false;
});
function Load() {
var BtnShowMore = document.getElementById("BtnShowMore");
BtnShowMore.innerHTML = "Loading...";
$.ajax({ type: "Post",
url: "Product" + "/" + "GetHomeEventAjax",
data: "{" + "PageNO" + ":" + PageNO + "}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function succ(data, states) {
if (states == "success") {
if (data.Content != null) {
var EventListArea = document.getElementById("result");
$('#result > tbody:last').append(data.Content);
PageNO = PageNO + 50;
BtnShowMore.innerHTML = "More";
endRun = false;
}
else BtnShowMore.innerHTML = "Loading is complete";
}
},
error: function err(result) { alert(result.responseText); }
});
}
</script>
</head>
<body>
<div id="container">
<table cellpadding="4" cellspacing="2" border="1" style="width: 450px; direction: rtl;"
id="result">
<tbody>
<tr>
<th>?? ????</th>
<th>??? ????</th>
<th>????</th>
</tr>
</tbody>
</table>
<a style="width: 200px" id="BtnShowMore">
Load</a>
</div>
</body>
</html>
In the scroll event script I need to found out what is the maximum value of vertical scroll so I get the container outer-Height but is wasn't exactly the maximum value it is 796px greater than it in the 1280x1024 screen resolution it can be different in different screen resolution setting. I need some help what should be instead of "796" number.
在滚动事件脚本中,我需要找出垂直滚动的最大值是多少,所以我得到了容器外层高度,但并不是最大值,它比 1280x1024 屏幕分辨率下的最大值大 796 像素,它可以不同在不同的屏幕分辨率设置中。我需要一些帮助,而不是“796”数字。
采纳答案by dtbarne
Try:
尝试:
$("#container").attr({ scrollTop: $("#container").attr("scrollHeight") });
Starting from JQuery 1.9.1, you'll need:
从 JQuery 1.9.1 开始,您将需要:
$("#container").scrollTop($("#container").prop("scrollHeight"));
回答by BlueRaja - Danny Pflughoeft
The posted answer is incorrect; the maximum value of scrollTop
is not scrollHeight
, it's scrollHeight - outerHeight
.
发布的答案不正确;的最大值scrollTop
不是scrollHeight
,而是scrollHeight - outerHeight
。
This will give you the correct value:
这将为您提供正确的值:
var elem = $("#container");
var maxScrollTop = elem[0].scrollHeight - elem.outerHeight();
回答by Ishan Dhingra
Best way to do this with-out jQuery.
最好的方法是在没有 jQuery 的情况下做到这一点。
document.getElementById('container').scrollTop = document.getElementById('container').scrollHeight;
using jQuery it did't worked for me, so try this one if having problem with above.
使用 jQuery 它对我不起作用,所以如果上面有问题,请尝试这个。