Question

我正在尝试制作一个代码，让我能够显示我网站的某个部分已被观看了多少。

我的问题是，当我重新刷新时，它会回到零而不是2.我希望你能帮助我。我希望代码能够永久运行，或者只要我想要它，它只会添加一个1，即使它是昨天。这是代码示例。

<script type="text/javascript">
var bannerViews = 0;
function addViews (){
bannerViews = bannerViews + 1;
}

addViews();
</script>



<p>This banner has been viewed <script type="text/javascript">document.write(bannerViews);</script> times </p>

希望你能帮助我。

Answer 1

它返回0，因为变量bannerViews在每次页面加载时重新初始化为0。您需要将此变量存储在JSON文件/ DB中，并在那里获取/更新值。

Answer 2

每次刷新页面时，代码都将被重置并包含变量。

要解决此问题，您必须使用Web服务器并将变量保存在那里，或者找到将变量保存到文件系统并加载它的方法回来。

Answer 3

计数器不断重置的原因是因为您在运行时声明了变量。变量没有持久性，所以每次加载网站时，变量都从0开始。每个浏览器客户端都会分别跟踪变量，所以即使你能够让变量在本地浏览器上保留，你无法跟踪其他浏览器的页面浏览量。此问题的解决方案是从中央服务器跟踪页面视图。

您可以使用免费服务（例如http://www.webestools.com/pages-views-counter-free-number-pages-views-statistics.html）来创建在页面浏览量和不同客户端之间保留的计数器。

Answer 4

这是因为每次刷新页面时，您的代码都会重新初始化。为了保存数据，您需要将其存储在某个地方。无论是在cookie还是本地存储中。

如果您继续使用本地存储，请按照以下方式进行操作。

var bannerViewCount = localStorage.getItem('bannerViews');

if(!bannerViewCount) {
  bannerViewCount = 0;
}

function addViews() {
  localStorage.setItem('bannerViews', ++bannerViewCount);
  document.body.innerHTML = 'Banner view count is :' + bannerViewCount;
}

addViews();

Demo（点击顶部栏上的“多次运行”并看到它递增）

在这里，首先要做的是获取横幅视图计数。如果我没有得到它，我会用零初始化它。

稍后，我在addViews()来电，我将bannerViewCount增加一个并将其存储到localStorage。那就是它。

请注意，数据存储在本地存储中，因此如果您希望其他用户也可以看到计数，则需要将其存储在数据库或文本文件中，然后再对其进行解析。

如果您想将其存储在云端，以便您可以在访问者之间共享计数，则可以执行以下操作。

＆＃13;

function addViews() {
  $.get('//jsonbin.io/b/5974382ca489d40388582791/latest', function(data) {
    var bannerViewCount = data.bannerviews;
    
    $.ajax({
      url: '//jsonbin.io/b/update/5974382ca489d40388582791',
      type: 'post',
      dataType: 'json',
      data: {
        snippet: JSON.stringify({
          bannerviews: ++data.bannerviews
        })
      },
      success: function(fetch) {
        var data = fetch.data;
        document.body.innerHTML = 'Banner view count is : ' + JSON.parse(data).bannerviews;
      }
    });
  });
}

addViews();

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

＆＃13;

点击＆＃34;运行代码段＆＃34; 按钮，查看计数器递增。转到任何其他浏览器，计数将按预期持续。请注意，可以操作此处存储的数据，因为没有适当的身份验证。因此，如果您希望计数准确且合法，请避免使用它。

Answer 5

您需要做的是获取初始值0，存储在服务器，数据库或文件中。将行var bannerViews = 0;更改为类似的内容;

var bannerViews = getValueFromServer();

每次重新分配后，都将其存储回外部存储器;

现在，每当你引用页面时。代码var bannerViews = 0;将会运行，因此bannerViews将被重新分配给0

变量每次刷新时重置为0

5 个答案: