所以我有一个很长的 div,当用户提交表单时,我需要保持滚动位置。因为我之前从未正确使用过 JavaScript,所以我不知道如何做到这一点。搜索答案并未提供可用的答案。我收集到的是,因为我使用 jQuery,所以我也许可以使用 .scrollTop(),但除此之外我不知道。
下面是 html 页面的粗略草图及其外观:
<html>
<head>
<title>Untitled Document</title>
<style>
#article-text {
height: 100px;
overflow: scroll;
}
</style>
</head>
<body>
<div>
Some random text.
</div>
<div id="article-text">
Very, very long text.
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
Even more text.
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
That is how long the text is
</div>
<div class="form-nav">
<input type="submit" name="add_event" value="Add Event">
</div>
</body>
</html>
单击“添加事件”后,将发送 POST 请求并重新加载页面:
View .py
elif 'add_event' in request.POST:
cp = request.POST.copy()
如何在“文章文本”div 中保存滚动进度?不是整个页面,而是特定的 div。希望这里有任何指点。
最佳答案
您的页面上没有表单,因此我猜测您正在使用 JS/jQuery 发起 POST 请求。
最佳方式:通过 AJAX 发送请求。
$.post(url, data, function(response){ /* success */ });
这样您就不需要重新加载页面,它会准确地保持在之前的滚动位置。
如果由于某种原因需要重新加载,您可以将当前滚动位置从 .scrollTop()
存储到 localStorage
中,并在每个页面加载时检查 localStorage 中的该值.
要设置该值,请在提交表单之前进行
localStorage.setItem('my-scroll-pos', $(window).scrollTop());
页面重新加载后,取回值。
var pos = localStorage.getItem('my-scroll-pos', 0);
if (pos)
$(window).scrollTop(pos)
关于javascript - 在表单提交时维护 div 中的滚动位置 - Django,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38057674/