保存页面的滚动条的位置

1ExpandedBlockStart.gifContractedBlock.gif/** <summary>
 2 InBlock.gif        /// 功能:在页面post时保存屏幕滚动状态;
 3 InBlock.gif        /// 直接在Page_Load中加入Zeda.CNE.Common.RetainScrollPosition();
 4 InBlock.gif        /// 不能加在if(!Page.IsPostBack){}内;
 5 InBlock.gif        /// 加入的两个隐藏域为__SCROLLPOS_TOP和__SCROLLPOS_LEFT
 6 ExpandedBlockEnd.gif        /// </summary>
 7 None.gif        public static void RetainScrollPosition()
 8 ExpandedBlockStart.gif ContractedBlock.gif         dot.gif{
 9 InBlock.gif            
10 InBlock.gif            System.Web.UI.Page page=(Page)HttpContext.Current.Handler;
11 InBlock.gif
12 InBlock.gif            page.RegisterHiddenField("__SCROLLPOS_TOP","0");
13 InBlock.gif            page.RegisterHiddenField("__SCROLLPOS_LEFT","0");
14 InBlock.gif                
15 InBlock.gif            string saveScrollPosition = "<script language='javascript'>function saveScrollPosition() {{document.forms[0].__SCROLLPOS_TOP.value = {0}.scrollTop;document.forms[0].__SCROLLPOS_LEFT.value = {0}.scrollLeft ;}}{0}.οnscrοll=saveScrollPosition;</script>";
16 InBlock.gif            string setScrollPosition = "<script language='javascript'>function setScrollPosition() {{{0}.scrollTop ='{1}';{0}.scrollLeft  ='{2}' }}{0}.οnlοad=setScrollPosition;</script>";
17 InBlock.gif            
18 InBlock.gif            page.RegisterStartupScript("saveScroll", string.Format(saveScrollPosition,"window.document.body"));
19 InBlock.gif
20 InBlock.gif            if (page.IsPostBack)
21 ExpandedSubBlockStart.gif ContractedSubBlock.gif             dot.gif{
22 InBlock.gif
23 InBlock.gif                page.RegisterStartupScript("setScroll", string.Format(setScrollPosition,"window.document.body", page.Request.Form["__SCROLLPOS_TOP"],page.Request.Form["__SCROLLPOS_LEFT"]));
24 ExpandedSubBlockEnd.gif            }
25 ExpandedBlockEnd.gif        }

转载于:https://www.cnblogs.com/xiongeee/archive/2007/03/21/683296.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在Vue中,要缓存table滚动条位置,你可以使用以下步骤: 1. 首先,在Vue的data中定义一个变量,用于存储滚动条位置,比如scrollPosition。 2. 在table元素上添加一个scroll事件监听器,当滚动事件触发时,将滚动条位置更新到scrollPosition中。 3. 在Vue的生命周期钩子函数中,比如created或mounted中,通过获取缓存中的滚动条位置,并将其赋值给scrollPosition。 4. 在Vue的updated钩子函数中,将scrollPosition中存储的滚动条位置重新应用到table元素上,以恢复滚动条位置。 下面是一个示例代码: ```vue <template> <div> <table ref="table" @scroll="saveScrollPosition"> <!-- 表格内容 --> </table> </div> </template> <script> export default { data() { return { scrollPosition: 0 } }, created() { // 从缓存中获取滚动条位置,并赋值给scrollPosition this.scrollPosition = localStorage.getItem('scrollPosition') }, mounted() { // 应用滚动条位置到table元素上 this.$refs.table.scrollTop = this.scrollPosition }, updated() { // 更新滚动条位置 this.$refs.table.scrollTop = this.scrollPosition }, methods: { saveScrollPosition() { // 监听滚动事件,并将滚动条位置保存scrollPosition中 this.scrollPosition = this.$refs.table.scrollTop // 将滚动条位置保存到缓存中 localStorage.setItem('scrollPosition', this.scrollPosition) } } } </script> ``` 在这个示例中,我们使用localStorage来保存滚动条位置,以便在页面刷新或重新加载后能够恢复滚动条位置。你也可以使用其他方式来存储和读取滚动条位置,比如vuex或cookie等。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值