gpt4 book ai didi

javascript - 在浏览器中“返回”并自动触发功能

转载 作者:行者123 更新时间:2023-12-01 03:01:49 25 4
gpt4 key购买 nike

我有两个 div,显示“红色”div,隐藏“蓝色”div。

当我从隐藏的“蓝色”div 中的超链接返回浏览器时,页面将自动返回到“红色”div。

但是,我需要它返回到“蓝色”div。

我怎样才能做到这一点?非常感谢您的帮助。

<html>
<head>
<style>
#red{
height: 400px;
width: 400px;
color: Red;
border: solid;
margin-bottom: 10px;
}
#blue{
display: none;
height: 300px;
width: 600px;
color: Blue;
border: solid;
margin-bottom: 10px;
cursor: pointer;
}
</style>
</head>
<body>
<div id="red">11</div>
<a href="https://www.google.com/">
<div id="blue">22</div>
</a>
<input type="button" value="Show Red" onclick="document.getElementById('red').style.display = 'block'; document.getElementById('blue').style.display='none';"></input>
<input type="button" value="Show Blue" onclick="document.getElementById('red').style.display = 'none'; document.getElementById('blue').style.display='block';"></input>
</body>
</html>

最佳答案

使用 localStorage 在浏览器中存储值。试试这个

<div id="red">11</div>
<a href="https://www.google.com/">
<div id="blue">22</div>
</a>

<input type="button" value="Show Red" onclick="
document.getElementById('red').style.display = 'block'; document.getElementById('blue').style.display='none';
localStorage.setItem('currentRed', 'block');
localStorage.setItem('currentBlue', 'none');" />

<input type="button" value="Show Blue" onclick="
document.getElementById('red').style.display = 'none'; document.getElementById('blue').style.display='block';
localStorage.setItem('currentRed', 'none');
localStorage.setItem('currentBlue', 'block');" />

<script>
if(localStorage.getItem('currentBlue')){
document.getElementById('blue').style.display = localStorage.getItem('currentBlue');
document.getElementById('red').style.display = localStorage.getItem('currentRed');
}
</script>

关于javascript - 在浏览器中“返回”并自动触发功能,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46398646/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com