×

主题开发

WordPress主题开发经验教程分享

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

王超 2019-12-06 主题开发 757 次

有时候,在网页中点击了页面中的按钮或是刷新了页面后,页面滚动条又 会回到顶部,想看后面的记录就又要拖动滚动条,或者要按翻页键,非常不方便,想在提交页面或者在页面刷新的时候仍然保持滚动条的位置不变,最好的办法就是 在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(&quot;scroll&quot;,document.documentElement.scrollTop);" onload="scrollback();">就可以在刷新或提交后滚动条的位置保持不变了。

文章标签:

WordPress日记主要承接WordPress主题定制开发PSD转WordPressWordPress仿站以及以WordPress为管理后端的小程序、APP,我们一直秉持“做一个项目,交一个朋友”的理念,希望您是我们下一个朋友。如果您有WordPress主题开发需求,可随时联系QQ:919985494