Question

我在我网站的首页上使用了一个页面加载器，我希望它只在第一次有人访问我的网站时才能运行，所以稍后会因为页面将被缓存而导致＃39 ;我会更快地进行练习，因此下次访问时我不会需要装载机。

我认为使用存储信号到缓存/ cookie这样做，但我不知道怎么做？

这里是加载器javascript：

function myFunction() {
  var myVar = setTimeout(showPage, 1000);
}

function showPage() {
  $("#loader_sec").css("display","none");
  $("#bodyloader").css("display","block");
}

myFunction();

<div id="loader_sec">
  ...
</div>

我应该如何配置缓存/ Cookie才能在有人首次访问时启动此代码？如果有更好的方法，请建议。

Answer 1

试着希望它会起作用

function myFunction() {
  var myVar = setTimeout(showPage, 1000);
}

function showPage() {
  $("#loader_sec").css("display","none");
  $("#bodyloader").css("display","block");
}
if(!localStorage.getItem("visted")){
   myFunction();
   localStorage.setItem("visted",true);
}


<div id="loader_sec">
  ...
</div>

Answer 2

尝试使用会话/本地存储。像这样 -

        $(window).load(function () {
            $(function () {
                if (!sessionStorage.getItem("runOnce")) {

                    // Your code goes here....

                    sessionStorage.setItem("runOnce", true);
                }
            });
        });

Answer 3

您需要在用户的设备上保留一些数据才能知道他们之前访问过您的网站。您可以通过本地存储或cookie来完成此操作。

这是一个可用于读/写cookie的简单库：https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie/Simple_document.cookie_framework

当用户显示页面加载器时，您可以为cookie写一个值。在页面加载时检查此值将告知您先前是否显示过加载程序，并告知您此次是否应显示加载程序。

Answer 4

我会在缓存/数据访问层中执行逻辑。当另一个函数完成时，您可以使用https://github.com/kriskowal/q执行函数作为回调。

然后你可以做

getData(key)
    .then(function () {
        hideLoader(); // Function for your show/hide logic
    });

或类似的东西。

getData看起来像：

var getData = function (key) {
    var deferred = Q.defer();
    if (cache[key]) { 
        deferred.resolve(cache[key]);
    } else {
        //Data request logic that returns 'data'
        deferred.resolve(data);
    }
    return deferred.promise;
};

通过这种方式，您不会猜测您的请求需要多长时间，并且您不会强迫用户再次加载第二个长时间，因为一旦检索到数据，页面就会加载。

顺便说一下，这里的缓存只是一个键/值存储。阿卡var cache = {};

如何在第一次访问网站时运行javascript

4 个答案: