Question

我的目标是 - 每次点击重新加载按钮时重新加载页面（使用javascript函数：window.location.reload（）;）并跟踪单击按钮（重新测试）的次数。该页面应仅在前三次点击时重新加载。如果单击按钮的次数超过三次，则应该导致不同的页面

代码：

   <div class = "text-center"> <button type="button" class="btn btn-success 
    btn-block" onclick ="myCheck();">Retake Test</button>

这是我遇到的解决方案（显然不起作用）

<script>
var count = 0;
 function myCheck () {
count = count+1;
 if (count < 3) {
    window.location.reload();
    }
else {
    document.write ("YYY");
    }
 }
 </script>

Answer 1

您可以尝试localStorage。

<script>
 localStorage.setItem('count', '0');
 function myCheck () {
  localStorage.setItem('count',  +(localStorage.getItem('count'))+ 1)
    if (+(localStorage.getItem('count')) < 3) {
      window.location.reload();
    }
    else {
      document.write ("YYY");
    }
 }
 </script>

这是一次匆忙的尝试，你可以让你的代码更简洁！

其他注意：同时避免使用内联javascript，例如onclick ="myCheck();" 请改用addEventListener。

Answer 2

由于您的变量通过重新加载页面而重置，您可能希望将count保存在其他位置。 Cookie是一个有用的选项，在现代浏览器中也可以使用local storage。

然而，您正在寻找的解决方案是通过AJAX重新加载您网页的一部分？

Answer 3

您的计数在页面重新加载时丢失了。使用localstorage或cookies

"use strict";

function myCheck() {
  var count = localStorage.getItem('count') || 0;
  if (count < 3) {
    localStorage.setItem('count', (count += 1) )
    return window.location.reload();
  }
  // more than or equal to 3 times
  document.write("YYY");
}

Answer 4

使用localStorage.setItem和localStorage.getItem

 <script>
 var count=typeof localastrorage.getItem('count')!="null"? localstorage.getItem('count'):0;
function myCheck () {
   localStorage.setItem("count",count);
count = count+1;
 if (count < 3) {
    window.location.reload();
    }
else {
    document.write ("YYY");
    }
 }
 </script>

如何在javascript中重新加载页面，同时限制单击按钮的次数？

4 个答案: