如何在页面刷新时保持活跃的onclick [关闭]
Posted
技术标签:
【中文标题】如何在页面刷新时保持活跃的onclick [关闭]【英文标题】：how to keep active onclick on page refresh [closed] 【发布时间】：2020-12-27 14:48:41 【问题描述】： $(document).ready(function ()
$("#2").click(function ()
$("#content").load("% url 'about' %");
);
$("#3").click(function ()
$("#content").load("% url 'pay' %");
);
);
========== html ============
<a id="2" href="#">click me </a>
<a id="3" href="#">pay </a>
<div id="content"></div>
<h1>hello</h1>
% endblock test %
我正在尝试存档，如果我重新加载页面，则在 div 中调用的 html 填充保持不变，直到我单击另一个页面链接。
【问题讨论】：
最好的办法是使用一些 cookie 或其他东西来存储点击的链接 你能给我一些例子或链接吗？ 您也可以使用window.history.pushState（以便更新网址）popstate 来重新设置页面刷新时的活动链接。
这能回答你的问题吗？ How do I modify the URL without reloading the page?
【参考方案1】：
您可以使用localStorage (https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage) 在页面重新加载之间保持有限状态。请记住，localStorage 将保持相同的值，即使您从具有相同网站/域的同一浏览器的另一个选项卡访问它也是如此。即使在浏览器重新启动之间它也会持续存在。
这是一个简单的测试：
<html>
<head>
<script>
function documentLoaded()
var contentDiv = document.getElementById("content");
function refresh()
contentDiv.innerHTML = localStorage.getItem("content");
var link1 = document.getElementById("link1");
var link2 = document.getElementById("link2");
var link3 = document.getElementById("link3");
link1.onclick = function()localStorage.setItem("content", "div text 1"); refresh();
link2.onclick = function()localStorage.setItem("content", "div text 2"); refresh();
link3.onclick = function()localStorage.setItem("content", "div text 3"); refresh();
refresh();
</script>
</head>
<body onload="javascript:documentLoaded()">
<a id="link1" href="javascript:void(0)">link 1</a><br />
<a id="link2" href="javascript:void(0)">link 2</a><br />
<a id="link3" href="javascript:void(0)">link 3</a><br />
<div id="content">default div text</div>
</body>
</html>如果你想让它在同一个浏览器中处理多个用户会话，你可以在本地存储 id 上附加一些唯一的用户标识符，例如localStorage.getItem("content" + currentUser.id);
【讨论】：
以上是关于如何在页面刷新时保持活跃的onclick [关闭]的主要内容，如果未能解决你的问题，请参考以下文章