asp.net通過Ajax UpdatePanel回傳后滾動條位置變更解決方法

更新時間：2010年06月21日 16:06:32 作者：

用一個隱藏控件保存當前scorll值?；貍骰貋砗蟾鶕?jù)scroll的值在重新設置scroll。

主要方法是：

用一個隱藏控件保存當前scorll值?；貍骰貋砗蟾鶕?jù)scroll的值在重新設置scroll。

1、首先用onscroll事件保存scorll值，并用HiddenField記錄scroll值

 
<div id="lv_content" class="unify_content" style="padding-left: 0; height: 455px;" onscroll="SetScrollPosition(this)"> 
</div> 
<asp:HiddenField ID="HiddenFieldScroll" runat="server" /> 

代碼
//2、編寫onscroll事件，主要用于保存當前控件的scroll值

復制代碼代碼如下:

 
function funSaveScroll(sender) { 
//得到隱藏控件 
var vScroll = $get('ctl00_ContentPlaceHolder1_hfLvScroll'); 
if (vScroll != null) { 
//設置隱藏控件的值為scorll值 
vScroll.value = sender.scrollTop; 
} 
} 

代碼

復制代碼代碼如下:

 
//3、在頁面的加載完成事件中處理scorll值 
var prm = Sys.WebForms.PageRequestManager.getInstance(); 
//設置加載完成事件 
prm.add_pageLoaded(pageLoaded); 

//加載完成重新設置控件的scroll值 
function pageLoaded(sender, args) { 
//得到要設置scroll值的控件 
var vDiv = $get("lv_content"); 
if (vDiv != null) { 
//得到隱藏控件 
var vScrollValue = $get("ctl00_ContentPlaceHolder1_hfLvScroll"); 
//設置控件的scroll值 
vDiv.scrollTop = vScrollValue.value; 
} 
} 

通過以上代碼就可以解決回傳回來后scroll變動的問題。

如果使用了Master頁面，可以將上邊的代碼放在master頁面中，進行公用。

1)先在Master頁面中加入HiddenField。

<asp:HiddenField ID="HiddenFieldScroll" runat="server" />

代碼

復制代碼代碼如下:

 
/* 
2)在master頁面中編寫onscroll事件，記錄其它頁面中控件的scroll值 
使用方法:只要在要設置控件中設置其ID并加入onscroll事件即可。即加入 onscroll="SetScrollPosition(this)"語句 
*/ 
function SetScrollPosition(sender) { 
var scrollTemp = $get("ctl00_HiddenFieldScroll"); 
if (scrollTemp != null) { 
//將要設置控件的ID和scroll值一起保存。中"|"分隔 
scrollTemp.value = sender.id + "|" + sender.scrollTop; 
} 
} 

代碼

復制代碼代碼如下:

 
//3)在頁面的加載完成事件中處理scorll值 
Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(onPageLoaded); 
//The Pageloaded for scroll orientation 
function onPageLoaded(sender, args) { 
var scrollTemp = $get("ctl00_HiddenFieldScroll"); 
if (scrollTemp != null) { 
var scorllValue = scrollTemp.value; 
if (scorllValue.length > 0) { 
var target = scorllValue.split("|"); 
if (target.length > 1) { 
var targetControlID = target[0]; 
var targetValue = target[1]; 
var targetControl = $get(targetControlID); 
//得到要設置控件 
if (targetControl == null || targetValue.length < 1) { 
return; 
} 
//設置控件的scroll值 
targetControl.scrollTop = targetValue; 
} 
} 
} 
} 

4)調(diào)用時，其它頁面控件中加onscroll="SetScrollPosition(this)" 并設置ID即可
<div id="lv_content" class="unify_content" style="padding-left: 0; height: 455px;" onscroll="SetScrollPosition(this)">
</div>

您可能感興趣的文章: