javascrip 返回上一页区别
时间: 2023-09-01 10:03:59 浏览: 49
JavaScript中返回上一页有两种不同的方法:通过history对象和使用window对象的location属性。
通过history对象返回上一页是最常见的方法。可以使用history对象的back()方法返回到上一页。代码如下:
```
<script>
function goBack() {
history.back();
}
</script>
```
使用这种方法返回上一页时,页面会重新加载并且所有的变量和状态都会重置。
另一种方法是通过window对象的location属性实现返回上一页。可以使用location对象的replace()方法来模拟点击浏览器的返回按钮。代码如下:
```
<script>
function goBack() {
window.location.replace(document.referrer);
}
</script>
```
这种方法返回上一页时,不会重新加载整个页面,而是加载上一页的缓存版本。所以之前的变量和状态都会保持不变。
总的来说,通过history对象返回上一页会重新加载整个页面,而通过window对象的location属性返回上一页只加载上一页的缓存版本。具体使用哪种方法,取决于项目的需求和实际情况。
相关问题
onclick 返回上一页
以下是两种实现onclick返回上一页的方法:
1.文字点击的方式实现:
```html
<a href="javascript:history.back(-1)">返回上一页</a>
```
或者
```html
<a href="#" onClick="javascript:history.back(-1);">返回上一页</a>
```
2.以图片点击的方式实现:
```html
<img src="图片的路径" onclick="javascript:window.history.back(-1);" title="返回上一页" alt="返回点击图片" />
```
或者
```html
<img src="图片的路径" onclick="javascript:history.back(-1);" title="返回上一页" alt="返回点击图片" />
```
uniapp返回上一页
你可以使用uniapp提供的 `uni.navigateBack()` 方法来返回上一页。这个方法可以接受一个可选的参数 `delta`,表示返回的页面数,默认为1,即返回上一页。如果需要返回到上上一页,可以将 `delta` 设置为2,以此类推。例如:
```javascript
uni.navigateBack({
delta: 1, // 返回上一页
success() {
console.log('返回成功');
}
});
```
如果你需要在返回上一页时传递一些数据,可以在上一页的 `onLoad` 方法中获取到这些数据。例如:
```javascript
// 上一页的代码
onLoad(options) {
const data = options.data;
console.log(data);
}
// 返回上一页并传递数据
uni.navigateBack({
delta: 1,
success() {
uni.navigateTo({
url: '/pages/previous-page/previous-page?data=some data'
});
}
});
```
在这个例子中,我们在返回上一页时跳转到了上一页,并通过 URL 参数 `data` 传递了一些数据,上一页可以通过 `onLoad` 方法获取这些数据。