Form表单提交返回或刷新页面后到原来提交的位置

发布于 2023.01.10

有时候，在网页中点击了页面中的按钮或是刷新了页面后，页面滚动条又会回到顶部，想看后面的记录就又要拖动滚动条，…

有时候，在网页中点击了页面中的按钮或是刷新了页面后，页面滚动条又会回到顶部，想看后面的记录就又要拖动滚动条，或者要按翻页键，非常不方便，想在提交页面或者在页面刷新的时候仍然保持滚动条的位置不变，最好的办法就是在 JS 中用 cookie 记录下当前滚动条的位置，然后刷新时读取 cookie 就可以实现这个功能了。
代码如下：

```
<script type="text/javascript">
```
```
function Trim(strValue) 
```
```
{ 
```

//return strValue.replace(/^s*|s*$/g,"");

```
return strValue;  
```
```
}
```
```
 
```
```
function SetCookie(sName,sValue) 
```
```
{ 
```

document.cookie = sName + "=" + escape(sValue);

```
} 
```
```
 
```
```
function GetCookie(sName) 
```
```
{ 
```

var aCookie = document.cookie.split(";");

for(var　i=0;　i < aCookie.length;　i++)

```
{ 
```
```
var aCrumb = aCookie[i].split("="); 
```
```
if(sName == Trim(aCrumb[0])) 
```
```
{ 
```
```
return unescape(aCrumb[1]); 
```
```
} 
```
```
} 
```
```
 
```
```
 return null; 
```
```
} 
```
```
 
```
```
function scrollback() 
```
```
{ 
```

if(GetCookie("scroll")!=null){document.documentElement.scrollTop=GetCookie("scroll")}

```
} 
```
```
</script>
```

然后在 HTML 页面中设置<body id=”body” onscroll=”SetCookie(“scroll”,document.documentElement.scrollTop);” onload=”scrollback();”>就可以在刷新或提交后滚动条的位置保持不变了。

类别：WordPress教程、

本文收集自互联网，转载请注明来源。
如有侵权，请联系 wper_net@163.com 删除。

猜你喜欢GUESS YOU LIKE

如何在WordPress中添加用户在线功能？

WordPress文章底部添加相关文章

WordPress静态缓存插件WP Super Cache

WordPress配置WP Super Cache缓存导致不计数的问题

WordPress自动给文章结尾添加原创声明

WordPress实现外链Go跳转效果

评论 (0)COMMENT