asp.net通過(guò)Ajax UpdatePanel回傳后滾動(dòng)條位置變更解決方法

用一個(gè)隱藏控件保存當(dāng)前scorll值。回傳回來(lái)后根據(jù)scroll的值在重新設(shè)置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、編寫(xiě)onscroll事件，主要用于保存當(dāng)前控件的scroll值 
 代碼如下:

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

代碼 
 代碼如下:

//3、在頁(yè)面的加載完成事件中處理scorll值 
var prm = Sys.WebForms.PageRequestManager.getInstance(); 
//設(shè)置加載完成事件 
prm.add_pageLoaded(pageLoaded); 
//加載完成重新設(shè)置控件的scroll值 
function pageLoaded(sender, args) { 
//得到要設(shè)置scroll值的控件 
var vDiv = $get("lv_content"); 
if (vDiv != null) { 
//得到隱藏控件 
var vScrollValue = $get("ctl00_ContentPlaceHolder1_hfLvScroll"); 
//設(shè)置控件的scroll值 
vDiv.scrollTop = vScrollValue.value; 
} 
} 
 
通過(guò)以上代碼就可以解決回傳回來(lái)后scroll變動(dòng)的問(wèn)題。 
如果使用了Master頁(yè)面，可以將上邊的代碼放在master頁(yè)面中，進(jìn)行公用。 
1)先在Master頁(yè)面中加入HiddenField。 
<asp:HiddenField ID="HiddenFieldScroll" runat="server" /> 
代碼 
 代碼如下:

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

代碼 
 代碼如下:

//3)在頁(yè)面的加載完成事件中處理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); 
//得到要設(shè)置控件 
if (targetControl == null || targetValue.length < 1) { 
return; 
} 
//設(shè)置控件的scroll值 
targetControl.scrollTop = targetValue; 
} 
} 
} 
} 
 
4)調(diào)用時(shí)，其它頁(yè)面控件中加onscroll="SetScrollPosition(this)" 并設(shè)置ID即可 
<div id="lv_content" class="unify_content" style="padding-left: 0; height: 455px;" onscroll="SetScrollPosition(this)"> 
</div>
 
 




聲明：本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí)，若有侵權(quán)等問(wèn)題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系，我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com