JS实现刷新页面后回到记录时滚动条的位置
window.onbeforeunload = function () {
var scrollPos;
if (typeof window.pageYOffset != 'undefined') {
scrollPos = window.pageYOffset;
}
else if (typeof document.compatMode != 'undefined' && document.compatMode != 'BackCompat') {
scrollPos = document.documentElement.scrollTop;
}
else if (typeof document.body != 'undefined') {
scrollPos = document.body.scrollTop;
}
document.cookie = "scrollTop=" + scrollPos; //存储滚动条位置到cookies中
} $(window).load(function () {
if (document.cookie.match(/scrollTop=([^;]+)(;|$)/) != null) {
var arr = document.cookie.match(/scrollTop=([^;]+)(;|$)/); //cookies中不为空,则读取滚动条位置
document.documentElement.scrollTop = parseInt(arr[1]);
document.body.scrollTop = parseInt(arr[1]);
}
}); //滚动条会到顶部
function scrollTop() {
document.documentElement.scrollTop = 0;
document.body.scrollTop = 0;
}
JS实现刷新页面后回到记录时滚动条的位置的更多相关文章
- 页面的div中有滚动条,js实现刷新页面后回到记录时滚动条的位置
当div中绑定数据,给它一个属性overflow-y: scroll,添加长度大小,使其能够出现滚动条:每次刷新的时候滚动条总是会出现在最上方,这使我很头疼,经过查阅网上资料,返现两种方法可行.如下: ...
- JS利用cookie记录当前位置实现刷新页面后还可以保持菜单栏的展开或闭合
代码如下,重点是JS部分的代码(部分样式引用的是Bootstrapt中的): <style> .sidebar-menu .special{ font-size: 16px; marg ...
- 刷新页面后,让控制台的js代码继续执行
在各种限时,秒杀活动中,有个自动循环的点击的工具是很重要的. 为了方便起见,我们把Js代码放在浏览器的控制台执行,但是刷新页面后,js代码就清空了,也就无法执行. 可以用js代码实现一个不受页面刷新影 ...
- js刷新页面不回到顶部
今天遇到刷新页面不回到顶部的需求 window.location.reload();方法已经解决了问题,但是ie8不支持,后来采用的是锚点这个方法 window.location = '/plan/g ...
- JS定时刷新页面及跳转页面
JS定时刷新页面及跳转页面 Javascript 返回上一页1. Javascript 返回上一页 history.go(-1), 返回两个页面: history.go(-2); 2. history ...
- 解决Vuex持久化插件-在F5刷新页面后数据不见的问题
页面刷新后,想保存页面未保存的数据.我们总是习惯于放在浏览器的sessionStorage和localStorage中.但是用了vue后,vuex便可以被应用了. vuex优势:相比sessionSt ...
- vue 页面间使用路由传参数,刷新页面后获取不到参数的问题
情况 情况再简单说明一下: 有三个页面(a-列表页面,b-内页1,c-内页2),页面a->页面b->页面c有参数传递.从a进入b后,刷新b页面拿不到a页面传进来的参数.或者b页面再进入c页 ...
- JS刷新页面后滚动条的位置不变
有时候,在网页中点击了页面中的按钮或是刷新了页面后,页面滚动条又 会回到顶部,想看后面的记录就又要拖动滚动条,或者要按翻页键,非常不方便,想在提交页面或者在页面刷新的时候仍然保持滚动条的位置不变,最好 ...
- selected 刷新页面后selected选中的值保持不表(thinkphp 从控制器assign 传值到js)
昨晚解决select 刷新页面以后选择的值保持不变,要想让seleted不变,有两种思路, 1,在提交表单的时候,将所选择的option的属性设为checked . 2.将option的value或者 ...
随机推荐
- C#/VB.NET 操作Word批注(二)——如何插入图片、读取、回复Word批注内容
序 在前面的文章C# 如何插入.修改.删除Word批注一文中介绍了如何操作Word批注的一些方法,在本篇文章中继续介绍操作Word批注的方法.分以下三种情况来介绍: 1. 插入图片到Word批注 2. ...
- Android开发——Drawable与Bitmap知识
从资源中获得drawable Drawable drawable = getResources().getDrawable(R.drawable.xxx); drawable转换bitmapdrawb ...
- Django学习之四:Django Model模块
目录 Django Model 模型 MODEL需要在脑子里记住的基础概念 区分清楚,必须不能混淆的 class Meta 内嵌元数据定义类 简单model创建实例 数据源配置 接着通过models在 ...
- Vue中父组件传子组件
父组件代码: <template> <section :class="menuMode === 'vertical' ? 'vertical-sub-nav' : 'sub ...
- 【代码笔记】Web-JavaScript-JavaScript JSON
一,效果图. 二,代码. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...
- SpringBoot集成mybatis配置
一个有趣的现象:传统企业大都喜欢使用hibernate,互联网行业通常使用mybatis:之所以出现这个问题感觉与对应的业务有关,比方说,互联网的业务更加的复杂,更加需要进行灵活性的处理,所以myba ...
- Python第六天 类型转换
Python第六天 类型转换 目录 Pycharm使用技巧(转载) Python第一天 安装 shell 文件 Python第二天 变量 运算符与表达式 input()与raw_inp ...
- SQL语句(理论)
1.SQL已经成为关系数据库的标准语言 2.SQL是一个非过程化的语言,因为他一次处理一个记录 3.SQL命令比较简单,最高级的命令几天之内便可掌握. 有属下类型的命令: 查询数据. 在表中插入.修改 ...
- Oracle获取表字段名,字段类型,字段长度,注释
SELECT b.comments as 注释, a.column_name as 列名, a.data_type || '(' || a.data_length || ')' as 数据类型, a. ...
- Zabbix监控USG6300防火墙及交换机
1.登录防火墙直接在web上面配置SNMP,只读团体名.读写团体名.Trap接收主机.安全名,点击应用完成防火墙上面的SNMP配置,如果你的命令行敲得6,可以使用命令行敲,配置效果一样,交换机没有这么 ...