如何在Javascript中隐藏单击的链接并保存在会话中

Question

我有一个使用Java，JSP和CSS的简单游戏应用程序。当在游戏板上点击一个问题时，它会将用户带到另一个JSP（问题），当用户提交答案时，它们会被带回游戏板。

我的HTML：

<td id="link"><a href="QuestionServy?question=0" onclick="myFunction()">100</a></td>

我的Javascript：

function myFunction() {
      document.getElementById('link').innerHTML = ""; 
}

问题在于，当用户选择并提交问题时，会将其重定向回游戏板页面，并且不会保存状态。

我研究过并发现你可以使用sessionStorage，但我不太清楚如何实现它。

非常感谢任何帮助！

修改

该计划目前的样子： game board

点击第一个链接后应该是什么样子： game board after click

Answer 1

你可以需要使用window.localStorage。

问题页面

您可以轻松地使用getItem和setItem功能：

function myFunction () {
    window.localStorage.setItem('answer1', 'bla bla bla');
    ...

    document.getElementById('link').innerHTML = "";
}

答案页

您可以在应用中的任何位置获取此值（即使在不同的会话之间），如下所示：

var answer1 = window.localStorage.getItem('answer1');

更新

sessionStorage仅为单个会话保存，并且（如上所述here）

  

在新标签页或窗口中打开页面将导致启动新会话

由于您在新标签页中打开问题页面，而不在同一页面（SPA样式）中，因此sessionStorage将过期。

解决方案

只需将window.sessionStorage替换为window.localStorage

即可

希望有所帮助：）

Answer 2

如果您想保存会话存储，可以使用以下代码

window.localStorage.setItem("variable name","value to be store");

在您的代码中显示如下

  function myFunction() {
        window.localStorage.setItem("qustn-no","0");
        document.getElementById('link').innerHTML = ""; 
    }   

您可以通过编写以下代码

在下一页或任何其他页面上检索此值

var abc=window.localStorage.getItem("qustn-no");