jQuery实现 浏览器后退到上次浏览位置
近日看腾讯、新浪的移动端网站,发现一件非常蛋疼的事情,在列表浏览内容,我往下翻,往下翻,突然,看到一个十分霸气的标题,于是点到文章查看详细内容,若干时间后,点回退按钮,浏览器回退到页面的最顶部了。
于是就写了这么一个jQery的小插件,当然,写完之后发现PC端的chrome可以记录浏览位置,泪奔
插件很简单,就是监听浏览器的滚动事件, 通过改变地址栏hash值记录访问位置,方便后退继续往后浏览器内容。
适用于文章列表。
使用方法: $('.setHash').BackToHash();
.setHash为列表元素选择器,需要设置有id或者name属性,如果列表内容会通过ajax追加,请设置参数mayAdd为true,或者在追加完成后调用add方法。
详细使用可以看demo
github地址:https://github.com/feng524822/BackToHash
jQuery实现 浏览器后退到上次浏览位置的更多相关文章
- react 从商品详情页返回到商品列表页,列表自动滚动上次浏览的位置
现状:目前从商品详情页返回到商品列表页,还需要再去请求服务数据,还需要用户再去等待获取数据的过程,这样用户体验非常不好, 遇到的问题: 1:如何将数据缓存, 2:如何获取和保存列表滑动的高度, 3:判 ...
- cookie记住浏览位置
/*返回上次浏览位置*/ $(function () { var str = window.location.href; str = str.substring(str.lastIndexOf(&qu ...
- vue中前进刷新、后退缓存用户浏览数据和浏览位置的实践
vue中前进刷新.后退缓存用户浏览数据和浏览位置的实践 2018年07月07日 11:58:40 大灰狼的小绵羊哥哥 阅读数:4492 vue中,我们所要实现的一个场景就是: 1.搜索页面==&g ...
- 浏览器后退按钮导致jquery动态添加的select option值丢失的解决方法
监控浏览器返回功能 判断浏览器返回功能 禁用浏览器的后退按钮 JS禁止浏览器后退键 http://volunteer521.iteye.com/blog/830522/ 浏览器返回功能 判断上一页面来 ...
- vue单页应用中 返回列表记住上次滚动位置、keep-alive缓存之后更新列表数据 那点事
实践场景需求 产品列表中,滚动到一定位置的时候,点击查看产品信息,后退之后,需要回到原先的滚动位置,这是常见的需求 所有页面均在router-view中,暂时使用了keep-alive来缓存所有页面, ...
- javascript怎么禁用浏览器后退按钮
1. <script language="JavaScript"> javascript:window.history.forward(1); </scri ...
- web测试误区:浏览器后退键退出系统会话失效
通过最近测试的项目,认识到实际:浏览器后退键退出系统,会话仍旧有效.打破了之前认为浏览器后退键就会退出系统登录的认知. 一,了解Cookie和Session的作用,具体来说cookie机制采用的是在客 ...
- js禁止Backspace键使浏览器后退
在项目中遇到按下Backspace键让浏览器后退的问题,上网搜了几种解决方案都不太理想.于是集众人之智,采众家之长,归纳如下: 这里主要参考博客http://q821424508.iteye.com/ ...
- js/jquery判断浏览器的方法小结
在网站前端开发中,浏览器兼容性是前端开发框架要解决的第一个问题,要解决兼容性问题就得首先准确判断出浏览器的类型及其版本,而判断浏览器的版本一般只能通过分析浏览器的userAgent才能知道.今天我们把 ...
随机推荐
- PHP搜索MYSQL数据库加分页浏览小结
PHP搜索加分页浏览小结: 1 分页后再做搜索 2 这里对于url的拼接,以及模糊查询,搜索时候的显示添加,SQL语句的拼接 3 对于页面传递过来的超级链接的变量,如果不存在就要设置,对于可能抛出异常 ...
- 靶形数独 (codevs 1174)题解
[问题描述] 小城和小华都是热爱数学的好学生,最近,他们不约而同地迷上了数独游戏,好胜的他们想用数独来一比高低.但普通的数独对他们来说都过于简单了,于是他们向Z 博士请教,Z 博士拿出了他最近发明的“ ...
- hdu 5224 Tom and paper
题目连接 http://acm.hdu.edu.cn/showproblem.php?pid=5224 Tom and paper Description There is a piece of pa ...
- SQL Server实现数据的递归查询
在一次项目中遇到一种需求,需要记录某产品的替换记录. 实际应用举例为:产品101被201替换,之后201又被303替换,303又被109替换:产品102被202替换,之后202又被105替换. 现在我 ...
- [转]insmod
[转]insmod http://www.cnblogs.com/amaoxiaozhu/archive/2013/03/08/2950002.html 在Linux下,驱动程序是内核的一部分,运行在 ...
- ubuntu14.04建立交叉编译环境, 注意事项
ubuntu14.04建立交叉编译环境, 注意事项 ~$ arm-linux-gcc/opt/FriendlyARM/toolschain/4.4.3/bin/arm-linux-gcc: 15: e ...
- 在数据表中添加一个字段的SQL语句怎么写
如果要在数据表中添加一个字段,应该如何表示呢?下面就为您介绍表添加字段的SQL语句的写法,希望可以让您对SQL语句有更深的认识. 通用式: alter table [表名] add [字段名] 字 ...
- Teamwork-Week2真对必应词典和有道词典的软件分析和用户需求调查(桌面版)
经调查,现在有道词典在该领域拥有很大程度的市场占有率,所以我们将有道词典与必应词典进行对比. 核心功能一:单词本 有道词典中的单词本都只能是由用户手动添加不会的单词,而必应词典中的单词 不仅可以被自己 ...
- 监听文本框输入开发仿新浪微博限制输入字数的textarea插件
监听文本框输入 Firefox.Chrome.IE9,IE10 均支持 oninput 事件,此外所有版本的 IE 均支持 onpropertychange 事件. oninput 事件在用户输入.退 ...
- Asp.net操作Excel(终极方法NPOI)(转)
原文:Asp.net操作Excel(终极方法NPOI) 先去官网:http://npoi.codeplex.com/下载需要引入dll(可以选择.net2.0或者.net4.0的dll),然后在网站中 ...