Question

我正在尝试使用jQuery .location.reload();刷新页面，然后.scroll()滚动到页面顶部。单独实现这两个功能都有效。

但是，当我尝试同时实现这两者时，页面不会滚动到顶部。它最初似乎滚动到顶部，然后被拖回页面底部。

function cancelUpdate(){
    $(".cancel-update" ).click(function(event) {
         event.preventDefault();
         location.reload();
         $('html, body').animate({ scrollTop: 0 }, 'fast'); 
         setTimeout(function () {
             // $('html, body').animate({ scrollTop: 0 }, 'fast');   
         }, 5500);
     });
  }

我尝试在setTimeout函数中将滚动设置为顶部 - 以防jQuery需要时间来执行该函数，但它无济于事。

Answer 1

有两种方法，第一种方法是在重新加载之前先滚动页面。第二个你可以尝试在重新加载后检查滚动是否在页面顶部，如果没有则滚动到顶部。

第二种方式：

$(document).ready(function(){
    if($('html').scrollTop() != 0)
       $('html, body').animate({ scrollTop: 0 }, 'fast');
});

Answer 2

一旦执行了location.reload（），考虑到刷新页面，所有以下代码都会丢失。尝试制作函数...一个用于执行重新加载的click事件...另一个将在页面加载时执行以进行滚动。

Answer 3

你可以用两个独立的功能来做到这一点。第一个滚动到所需位置，并在页面加载后执行;第二个将位置更改为具有不同参数的同一页面（使用cookie也相当可观）。

当用户执行某项操作时，您可以使用save = () => { for (var j = 0; j < this.templatetypes.length; j++) { this.template = this.templatetypes[j]; this.smsTemplate.Template_Type_LSeq = this.template.value; this.smsTemplate.SmsCode = this.template.smsCode; this.smsTemplate.SmsName = this.template.smsName; this.smsTemplate.SmsMessageTemplate = this.template.smsFormat; this.smsTemplateSvc.postSmsTemplate(this.smsTemplate).then(() => { return; }); } }调用重定向。

reloadPage(0)

页面加载后，您可以触发function reloadPage(pos){ window.location = 'http://www.yourpage.com?position=' + pos; }

autoScroll()

Answer 4

这对我有用。我必须将所有内容包装到超时功能中

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>CSS test</title>
</head>
<body>
     <div style="float: left; border: solid red 1px;margin-bottom:90px">foo</div>
     <div style="clear: both; border: solid red 1px">This div should not touch the other div.</div>
</body>
</html>

.scroll（）到top不适用于.location.reload（）;

4 个答案: