页面重新加载后按钮更改

所以我有一个按钮，我想控制一个过程。 该过程可以运行/暂停/停止。

 Run Pause  

所以按钮处于相同的位置，我想要的是当点击运行按钮时出现暂停按钮，反之亦然。

  function sendData(){ //some values window.location.href = '${createLink(controller:'run', action:'run')}' + '?dbvalue=' + db + '&fsvalue=' + fs; document.getElementById("run").style.visibility="hidden"; document.getElementById("pause").style.visibility="visible"; } 

发生的事情是它会出现一秒钟然后恢复运行，因为页面重新加载window.location.href，我用它来将值发送回我的控制器。

任何人都知道解决这个问题的方法或更好的实现方法。

提前致谢

Answer 1

重新加载页面就像擦除白板并重新开始一样。 下一页不会记住您之后运行的JavaScript的状态。 按钮的设置需要在下一页加载时进行。 理想情况下，您的服务器端代码应该设置按钮的状态。

Answer 2

试试以下代码：

 function sendData(){ //your implementation $("#run").css("visibility","hidden"); $("#pause").css("visibility","visible"); } function sendData1(){ //your implementation $("#pause").css("visibility","hidden"); $("#run").css("visibility","visible"); } 

Answer 3

在页面重新加载后，您将需要使用cookie或会话来保留更改。

Answer 4

通过单击运行，将调用sendData函数，将显示该运行并且不会显示暂停，因为如果我们单击暂停，则以相同的方式保持style.display =“none”，运行按钮将不会显示，因为我们是使用style.display =“none”

 function sendData(){ document.getElementById("run").style.display="block"; document.getElementById("pause").style.display="none"; } function sendData1(){ document.getElementById("run").style.display="none"; document.getElementById("pause").style.display="block"; } 

Answer 5

所以我解决了这个问题。 一些答案没有考虑到页面重新加载。 当用户点击运行时，我将其发送回控制器

 window.location.href = '${createLink(controller:'run', action:'run')}' + '?dbvalue=' + db+ '&buttonValue=' + "hideRun" 

然后在控制器中我拿了hideRun并将其发送回页面

  String button = params.buttonValue render view:'run.gsp', model:[button:button] 

然后我有一个在每个页面加载时被调用的函数

  window.onload = function() 

其中检查了价值

  "${button}" 

然后，如果它是“hideRun”，它将隐藏将显示暂停按钮的urn按钮。 反之亦然……