a页面跳转到b页面并值传给b页面,b页面接收到值后通过点击事件回到a页面并把接收到的值传回去
时间: 2024-03-24 15:38:51 浏览: 15
好的,这个问题涉及到前端页面之间的传值和页面跳转,可以通过以下步骤实现:
1. 在 a 页面中,定义一个变量存储要传递的值,例如:
```
let myValue = 'hello';
```
2. 在 a 页面中,使用 JavaScript 跳转到 b 页面,并把值作为参数传递给 b 页面,例如:
```
window.location.href = 'b.html?value=' + myValue;
```
3. 在 b 页面中,通过 JavaScript 获取 URL 参数中的值,并存储到一个变量中,例如:
```
let receivedValue = window.location.search.substring(1).split('=')[1];
```
4. 在 b 页面中,定义一个点击事件,在点击事件中使用 JavaScript 跳转回 a 页面,并把接收到的值作为参数传递回去,例如:
```
document.getElementById('back-btn').addEventListener('click', function() {
window.location.href = 'a.html?value=' + receivedValue;
});
```
5. 在 a 页面中,通过 JavaScript 获取 URL 参数中的值,并存储到一个变量中,例如:
```
let returnedValue = window.location.search.substring(1).split('=')[1];
```
注意:这种方式只适用于传递少量数据,如果需要传递大量数据,建议使用其他方式,如使用全局变量或者本地存储等。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)