本文介绍了几种在网页刷新或回发后保持滚动位置的方法，包括使用ASP.NET的SmartNavigation属性、自定义JavaScript脚本和控件聚焦脚本，旨在提升用户体验。
方法一：
#region "防止页面滚动"
public void RetainScrollPosition(System.Web.UI.Page myPage,string strBodyName)
{
StringBuilder saveScrollPosition = new StringBuilder ();
StringBuilder setScrollPosition = new StringBuilder ();
myPage.RegisterHiddenField("__SCROLLPOS", "0");
saveScrollPosition.Append("<script language='javascript'>");
saveScrollPosition.Append("function saveScrollPosition() {");
saveScrollPosition.Append(" document.forms[0].__SCROLLPOS.value = " + strBodyName +".scrollTop;");
saveScrollPosition.Append("}");
saveScrollPosition.Append( strBodyName + ".onscroll=saveScrollPosition;");
saveScrollPosition.Append("</script>");
myPage.RegisterStartupScript("saveScroll", saveScrollPosition.ToString());
if (myPage.IsPostBack)
{
setScrollPosition.Append("<script language='javascript'>");
setScrollPosition.Append("function setScrollPosition() {");
setScrollPosition.Append(" " + strBodyName + ".scrollTop = " + myPage.Request["__SCROLLPOS"] + ";");
setScrollPosition.Append("}");
setScrollPosition.Append(strBodyName + ".onload=setScrollPosition;");
setScrollPosition.Append("</script>");
myPage.RegisterStartupScript("setScroll", setScrollPosition.ToString());
}
}
#endregion
方法二：
Page.SmartNavigation = true;
Not在此把Not在做一个项目时的解决方法拿出来与大家共享。
Not的思路是事件执行完后写段脚本，让页面自动滚动到刷新页面之前的控件处，减少页面刷新带来的不便。
比如按了一个按钮后，脚本会自动将页面自动滚动到这个按钮的位置。
写段脚本的事情Not用了一个ScriptHelper的类来搞定，这个类有个GetViewControlScript(string controlName)的方法，它返回是一段客户端的脚本，传入的参数就是这个控件的ID。
ScriptHelper类代码：
/// <summary>
/// 提供一些产生页面脚本的方法
/// </summary>
public class ScriptHelper
{
/// <summary>
/// 获取客户端查看控件的脚本
/// </summary>
/// <param name="controlName"></param>
/// <returns>脚本代码</returns>
public static string GetViewControlScript(string controlName)
{
//创建客户端函数ViewObj
string script = "/n";
script += "<script language=/"javascript/">/n";
script += "function ViewObj(objName)/n";
script += "{/n";
script += "var obj = document.all.item(objName);/n";
script += "if (obj != null)/n";
script += "{/n";
script += "/tobj.scrollIntoView();/n";
script += "/tobj.focus();/n";
script += "}/n";
script += "}/n";
//创建客户端函数ToDo
script += "function ToDo()";
script += "{/n";
script += string.Format("setTimeout(/"ViewObj('{0}')/",1000);/n", controlName);
script += "}/n";
script += "window.onload = ToDo;/n";
script += "</script>/n";
return script;
}
}
使用示例：
为了方便输入脚本，我在页面上放了个Label：lblScript，并把lblScript的EnableViewState属性和Visible属性设成False。
然后在lblScrpt的Click事件的操作代码后添加输入脚本的代码，如下所示：
private void btnSave_Click(object sender, System.EventArgs e)
{
project.UpdateProjectInfo(ds);
lblScript.Text = ScriptHelper.GetViewControlScript("btnSave");
}
在点击btnSave按钮后，页面会自动滚动到btnSave的位置，减少了页面刷新带来的不便。
#region "防止页面滚动"public void RetainScrollPosition(System.Web.UI.Page myPage,string strBodyName){StringBuilder saveScrollPosition = new StringBuilder ();StringBuilder setScrollPosition = new StringBuilder ();myPage.RegisterHiddenField("__SCROLLPOS", "0");saveScrollPosition.Append("<script language='javascript'>");saveScrollPosition.Append("function saveScrollPosition() {");saveScrollPosition.Append(" document.forms[0].__SCROLLPOS.value = " + strBodyName +".scrollTop;");saveScrollPosition.Append("}");saveScrollPosition.Append( strBodyName + ".onscroll=saveScrollPosition;");saveScrollPosition.Append("</script>");myPage.RegisterStartupScript("saveScroll", saveScrollPosition.ToString());if (myPage.IsPostBack){setScrollPosition.Append("<script language='javascript'>");setScrollPosition.Append("function setScrollPosition() {");setScrollPosition.Append(" " + strBodyName + ".scrollTop = " + myPage.Request["__SCROLLPOS"] + ";");setScrollPosition.Append("}");setScrollPosition.Append(strBodyName + ".onload=setScrollPosition;");setScrollPosition.Append("</script>");myPage.RegisterStartupScript("setScroll", setScrollPosition.ToString());}}#endregion方法二：
Page.SmartNavigation = true;
有可能会造成你页面JavaScript 出错，这是ASP.NET 的一个BUG
方法三：
利用<大眼睛>的原理，我把过程简化了一下，分三部分：
一、
在<form>与</form>之间插入<input type="hidden" name="__SCROLLPOS">，用以记录页面的当前滚动位置；
二、
给<body>起个名字，比如：<body id="theBody">，同时编写body的onscroll事件，总体如下：
<body id="theBody" onload="bodyload()" onscroll="document.all["__SCROLLPOS"].value = theBody.scrollTop;">
三、
在Page_Load事件中加入如下代码(vb.net)，作用在于ie显示该页面时，马上重新定位原来的滚动位置：
Dim js As String
js = "<script language=""javascript"">function bodyload() {"
js &= "js &= "theBody.scrollTop = " & CInt("0" & Request.Form("__SCROLLPOS")) & "; "
js &= "document.forms[0].__SCROLLPOS.value = " & CInt("0" & Request.Form("__SCROLLPOS")) & "; "
js &= "}</script>"
Response.Write(js)
Not在此把Not在做一个项目时的解决方法拿出来与大家共享。Not的思路是事件执行完后写段脚本，让页面自动滚动到刷新页面之前的控件处，减少页面刷新带来的不便。比如按了一个按钮后，脚本会自动将页面自动滚动到这个按钮的位置。写段脚本的事情Not用了一个ScriptHelper的类来搞定，这个类有个GetViewControlScript(string controlName)的方法，它返回是一段客户端的脚本，传入的参数就是这个控件的ID。ScriptHelper类代码： /// <summary> /// 提供一些产生页面脚本的方法 /// </summary> public class ScriptHelper { /// <summary> /// 获取客户端查看控件的脚本 /// </summary> /// <param name="controlName"></param> /// <returns>脚本代码</returns> public static string GetViewControlScript(string controlName) { //创建客户端函数ViewObj string script = "/n"; script += "<script language=/"javascript/">/n"; script += "function ViewObj(objName)/n"; script += "{/n"; script += "var obj = document.all.item(objName);/n"; script += "if (obj != null)/n"; script += "{/n"; script += "/tobj.scrollIntoView();/n"; script += "/tobj.focus();/n"; script += "}/n"; script += "}/n"; //创建客户端函数ToDo script += "function ToDo()"; script += "{/n"; script += string.Format("setTimeout(/"ViewObj('{0}')/",1000);/n", controlName); script += "}/n"; script += "window.onload = ToDo;/n"; script += "</script>/n"; return script; } }使用示例：为了方便输入脚本，我在页面上放了个Label：lblScript，并把lblScript的EnableViewState属性和Visible属性设成False。然后在lblScrpt的Click事件的操作代码后添加输入脚本的代码，如下所示：private void btnSave_Click(object sender, System.EventArgs e){ project.UpdateProjectInfo(ds); lblScript.Text = ScriptHelper.GetViewControlScript("btnSave");}在点击btnSave按钮后，页面会自动滚动到btnSave的位置，减少了页面刷新带来的不便。
扫一扫
896
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
