浏览器以后返回按钮为什么还要用history.back

2024-10-24

javascript解决在safari浏览器中使用history.back()返回上一页后页面不会刷新的问题

我们知道,在JavaScript中提供了一个window.history.back()方法用于返回上一页,另外也可以使用window.history.go(-1)返回上一页(跳转). 在其他的主流浏览器中(Chrome.Firefox等),使用这两个方法都会重新执行返回页面的JS. 这就意味着,当文档加载完成事件函数中有刷新页面的操作代码的情况下,上一个页面会刷新. 但是在Safari浏览器中则情况有一些不同. 在实际测试中,在移动端中Android设备都会刷新,但是在IOS设备的Safari浏

vue-微信浏览器左上角返回按钮拦截

[需求] 在微信公众号开发中,有时需要对浏览器左上角返回按钮进行拦截处理相关的页面逻辑,而并不是让页面直接返回上一页,之前在这个细节点上的一直实现得不是很好.但看到京东购物公众号上的效果却实现得非常好,所以自己也开始了这方面的尝试.京东的效果如下图: 从上图京东购物效果上来看,在点击搜索拉起一个搜索界面,然后点击左上角反回,只是将搜索界面收起,而页面没有重新像读取进度条一样去返回,而我页面需要的正是这样的效果,下面就用vue来做一个这个过程的 demo 吧. [前提] 微信左上角的返回按钮其实无

JS 监听微信、支付宝等移动app及浏览器的返回、后退、上一页按钮的事件方法

在实际的应用中,我们常常需要实现在移动app和浏览器中点击返回.后退.上一页等按钮实现自己的关闭页面.调整到指定页面或执行一些其它操作的需求: 那在代码中怎样监听当点击微信.支付宝.百度糯米.百度钱包等app的返回按钮或者浏览器的上一页或后退按钮的事件呢. 下面就来告诉大家怎样监听的方法: 首先我们要了解浏览器的history.大家知道在页面中我们可以使用javascript window history,后退到前面页面,但是由于安全原因javascript不允许修改history里已有的url

JS监听浏览器的返回、后退、上一页按钮的事件方法

在实际的应用中,我们常常需要实现在移动app和浏览器中点击返回.后退.上一页等按钮实现自己的关闭页面.调整到指定页面或执行一些其它操作的需求,那在代码中怎样监听当点击微信.支付宝.百度糯米.百度钱包等app的返回按钮或者浏览器的上一页或后退按钮的事件呢. 我相信很多朋友像我一样,在百度.搜狗里面搜索很久都没找到方法. 下面就来告诉大家怎样监听的方法: 首先我们要了解浏览器的history. 大家知道在页面中我们可以使用javascript window history,后退到前面页面,但是由于安

JS监听微信、支付宝等移动app及浏览器的返回、后退、上一页按钮的事件方法

$(function(){ pushHistory(); window.addEventListener("popstate", function(e) { alert("我监听到了浏览器的返回按钮事件啦");//根据自己的需求实现自己的功能 }, false); function pushHistory() { var state = { title: "title", url: "#" }; window.history.

HTML5 浏览器返回按钮/手机返回按钮事件监听

1.HTML5 History对象支持使用pushState()方法修改地址栏地址,而不刷新页面. popstate事件当history实体被改变时,popstate事件将会发生.调用pushState()方法或者replaceState()方法是触发,当用户点击浏览器返回按钮时也会触发. 事件注册实例: window.addEventListener('popstate', function (event) { console.info(event); console.info(even

监听当点击微信等app的返回按钮或者浏览器的上一页或后退按钮的事件

在实际的应用中,我们常常需要实现在移动app和浏览器中点击返回.后退.上一页等按钮实现自己的关闭页面.调整到指定页面或执行一些其它操作的需求,那在代码中怎样监听当点击微信.支付宝.百度糯米.百度钱包等app的返回按钮或者浏览器的上一页或后退按钮的事件呢. 首先我们要了解浏览器的history.大家知道在页面中我们可以使用JavaScript window history,后退到前面页面,但是由于安全原因javascript不允许修改 history里已有的url链接,但可以使用pushStat

很多人都不知道的监听微信、支付宝等移动app及浏览器的返回、后退、上一页按钮的事件方法

版权声明:本文为博主原创文章,未经博主允许不得转载. 在实际的应用中,我们常常需要实现在移动app和浏览器中点击返回.后退.上一页等按钮实现自己的关闭页面.调整到指定页面或执行一些其它操作的需求,那在代码中怎样监听当点击微信.支付宝.百度糯米.百度钱包等app的返回按钮或者浏览器的上一页或后退按钮的事件呢. 我相信很多朋友像我一样,在百度.搜狗里面搜索很久都没找到方法.下面就来告诉大家怎样监听的方法: 首先我们要了解浏览器的history.大家知道在页面中我们可以使用JavaScript wi

监听微信、支付宝等移动app及浏览器的返回、后退、上一页按钮的事件方法

在实际的应用中,我们常常需要实现在移动app和浏览器中点击返回.后退.上一页等按钮实现自己的关闭页面.调整到指定页面或执行一些其它操作的需求,那在代码中怎样监听当点击微信.支付宝.百度糯米.百度钱包等app的返回按钮或者浏览器的上一页或后退按钮的事件呢. 我相信很多朋友像我一样,在百度.搜狗里面搜索很久都没找到方法.下面就来告诉大家怎样监听的方法: 首先我们要了解浏览器的history.大家知道在页面中我们可以使用javascript window history,后退到前面页面,但是由于安全

jquery 微信端点击物理返回按钮，弹出提示框

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>微信退出</title> <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no

window.history，页面中的返回按钮

一.页面中的返回按钮事件 window.history可以不加window这个前缀他的方法有: window.history.go(-1); //-n表示后退n页,n表示前进n页,或者是一个url window.history.back(); //同样表示后退一页 window.history.forward(); //表示前进如果页面是从一个微信上的链接跳过去的,或者直接在浏览器输入地址进去的,此时回不到上一页,我们可以用 document.referrer 来判断有没有上一页,如果没有可

浏览器返回按钮不会触发onLoad事件

最近在做一个移动端项目,发现移动端某些返回和PC端是有差异的, 比如ios中返回按钮是直接使用缓存的, 不会执行任何js代码, 这个问题很蛋疼, 例如, 在提交的时候将按钮设置为loading状态, 如果在提交成功后没有对按钮进行处理, 那么返回后按钮依然是loading状态, 这种体验很差, 如下图: 此问题是由于某些浏览器在back的时候是直接使用的之前的视图,页面没有进行重新加载而导致的,在网上找了些资料, 发现这是H5的一些新特性Back-Forward Cache(简称bfcache)

ASP.NET 中的返回按钮的实现【转】

返回上一页的这个东东在我们做项目的时候一般是用于填写完表单后确认的时候,有对原来输入的数据进行修改时用的,或者是因为网站为了方便浏览者而有心添加的一个东东,一般这种功能的实现在ASP.net中都是用一个button的控件来实现的,实现的方法有很多,今天恰好在做项目时碰到要用这个东东,我就把能实现" 返回上一页","返回前一页"的几种方法总结了一下,供大家学习之用,请多多指教:0) 其实要实现这个功能主要还是要用到javascript 方法一: 在asp.ne

如何给magento的产品页面添加返回按钮

如何给magento的产品页面添加返回按钮,最模板提供教程第一步: 打开 E:\xampp\htdocs\magento\skin\frontend\default\bluescale\css\styles.css 在底部添加返回按钮css代码,如下: /* Back Button */ .product-b 如何给magento的产品页面添加返回按钮,最模板提供教程第一步: 打开 E:\xampp\htdocs\magento\skin\frontend\default\bluescale

html5手机返回按钮跳转到指定页面问题

最近在做活动的时候有一个这样的场景,在主页面点击跳出一个弹层表单,填写完信息后,点击确认跳转到指定的展示页面了.这时候在手机端点击浏览器自带的返回按钮后,回到主页面,这时候主页面无法刷新,弹层信息还在.所以采用了html5的一个方法让展示页面返回时跳转到指定页面 index.html是我的主页面,在该页面有个弹层表单: show.html是我的展示页面,在该页面有返回按钮监听的方法 show.html页面添加下面脚本,监听跳转到首页地址: window.onpopstate = function

vue打包成app后，点击手机上的物理返回按钮后直接退出app

在浏览器上浏览vue项目时,后退按钮是可以正常返回上一页的,但是打包成app后,点击手机上的屋里返回按钮,就直接退出app回到桌面了, 以下是解决办法: 使用mui进行手机的物理键的监听 1.首先安装 vue-awesome-mui cnpm install vue-awesome-mui 2.在main.js中注册并使用 import Mui from 'vue-awesome-mui'; Vue.use(Mui); 3.在index.html中写如下的js代码 <script type=&quo