如何跟踪页面重新加载后已按下的按钮

Question

我是Javascript和JQuery的新手。在网上搜索解决方案后，我决定发布这个问题。

问题:当用户单击iframe内的链接时，它更新父元素上的进度条，这只触发一次。但是，当用户转到另一个页面并返回时，iframe中的页面被重新加载，javascript也是如此，这意味着可以再次更新该按钮的进度条，这是我不想要的。是否有任何方法来跟踪哪些元素被点击后，重载和禁用该功能?url参数? ?

HTML in iframe:

<div id="sidenav">
   <ul>
      <li><a href="../right/section1/page1.html" target="presentation" class="active" name="position">positioning</a></li> 
      <li><a href="../right/section1/page2.html" target="presentation">comparisons</a></li>
    </ul>
</div>

Javascript in iframe page:

$('#sidenav ul li a').one('click', window.parent.updateBar);

Answer 1

无论您想在客户端记录什么，您基本上都有相同的选择:

<
• 饼干/gh>客户端存储的
<
• url散列/gh>

或:

• 往返服务器并将数据存储在结果页

Answer 2

类似于localStorage。唯一的缺点是，它是持久的，即使重新启动等，但你可以重置值，如果你的整个网站重新加载。IE7及以下版本也不支持。

function updateBar() {
    if(localStorage['pressed'] == 'true') return; // abort if already pressed
    // do things
    localStorage['pressed'] = 'true'; // save the data that it is pressed
}

Answer 3

您可能希望在服务器端做类似的事情。跟踪页面上的数据状态通常是在服务器端完成的，这样就可以将逻辑排除在接口之外。使将来的维护更加容易。