H5返回上一页并刷新上一页
时间: 2023-08-08 10:09:46 浏览: 394
实现返回上一页并刷新上一页可以通过以下几个步骤:
1. 获取上一页的 URL。
2. 在当前页面使用 `window.history.go(-1)` 返回上一页。
3. 在上一页的页面加载完成后,使用 `location.reload()` 刷新上一页。
以下是示例代码:
```javascript
// 获取上一页的 URL
let prevUrl = document.referrer;
// 返回上一页
window.history.go(-1);
// 在上一页加载完成后,刷新页面
window.addEventListener('load', function() {
if (document.URL === prevUrl) {
location.reload();
}
});
```
在这个示例中,我们使用 `document.referrer` 来获取上一页的 URL,然后在当前页面使用 `window.history.go(-1)` 返回上一页。在上一页加载完成后,我们检查当前页面的 URL 是否等于上一页的 URL,如果是,就使用 `location.reload()` 刷新页面。这样就能实现返回上一页并刷新上一页的效果了。
相关问题
H5返回上一页并刷新的代码
你可以使用以下 JavaScript 代码实现返回上一页并刷新页面的功能:
```javascript
window.history.go(-1);
location.reload();
```
其中 `window.history.go(-1)` 用于返回上一页,`location.reload()` 用于刷新页面。将这两个函数结合起来即可实现返回上一页并刷新页面的效果。
uniapp在h5端如何实现,浏览器刷新后,返回上一页的问题
在uni-app中,可以通过uni.navigateTo和uni.redirectTo两个API路由方式实现页面跳转。其中,uni.navigateTo跳转后可以通过浏览器的返回按钮返回上一页,但是在浏览器中刷新页面后,不能保留跳转的历史记录,因此返回上一页也不可用。
对于这个问题,可以通过使用uni-back后退组件来解决。这个组件可以保存每个页面的浏览历史记录,即使在浏览器中刷新页面,也可以返回上一页。
使用uni-back组件需要在App.vue中引入并添加到页面底部,如下所示:
```
<template>
<div>
<router-view></router-view>
<uni-back></uni-back>
</div>
</template>
<script>
import UniBack from '@/components/uni-back/uni-back.vue'
export default {
components: {
UniBack
}
}
</script>
```
通过这样的方式,无论在哪个页面,都可以通过点击底部的返回按钮来返回上一页,即使浏览器中刷新了页面也可以正常使用。
阅读全文