• Ajax UpdatePanel 回传后滚动条位置变更解决方法


    主要方法是:

          用一个隐藏控件保存当前scorll值。回传回来后根据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)调用时,其它页面控件中加onscroll="SetScrollPosition(this)" 并设置ID即可--%>
    <div id="lv_content" class="unify_content" style="padding-left: 0; height: 455px;"  onscroll="SetScrollPosition(this)">
    </div>


     

  • 相关阅读:
    PS制作动感酷炫水人街舞照
    PS调出水彩画效果古装人物照片
    PS调出怀旧雨中特写的非主流照片
    PS制作墙壁上海报卷页图片效果
    PS绘制扁平化风格相机镜头UI图标
    PS调出甜美艺术外景女生照片
    PS调出冷绿色电影画面风格
    PS调出通透唯美阳光外景女生照片
    PS调出唯美冷色情侣婚纱写真照
    c#类中字段和方法中变量的声明问题
  • 原文地址:https://www.cnblogs.com/scottckt/p/1761949.html
Copyright © 2020-2023  润新知