2017-02-23 93 views
-1

我在我的网站的首页上使用页面加载器,我希望它只在有人第一次访问我的网站时运行,所以稍后页面将被缓存,它的执行速度会更快,因此下次访问时我不需要加载器。如何仅在第一次访问网站时运行javascript

我以为使用存储信号缓存/饼干这样做,但我不知道如何?

这里是装载机的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> 

我应该如何配置高速缓存/ cookies来推出这个代码仅在第一次有人访问?如果有更好的方法,请提出建议。

+0

[我以为使用存储信号缓存/饼干这样做,但我不知道如何?](https://duckduckgo.com/?q=javascript+read+and+write+cookies&t= h_&ia = qa) – Quentin

+0

您可以使用它的Cookie – Jer

回答

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> 
+0

JS可以工作,但这是一个问题,因为一个myfunction();被禁用没有什么是把HTML的'显示:无;'所以装载程序正在运行,并没有下车 – Lindow

0

您需要在用户的设备上保留一些数据才能知道他们之前访问过您的网站。你可以通过本地存储或cookies来做到这一点。

下面是一个简单的库,你可以用它来读/写饼干:https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie/Simple_document.cookie_framework

你可以将值写入当用户已经显示出的页面加载器的cookie。当页面加载时检查这个值会让你知道加载器是否已经显示过,并告知你的决定是否应该显示这次。

1

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

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

        // Your code goes here.... 

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

该JS的作品,但它是一个问题,因为当myfunction();被禁用没有什么是把HTML的'显示:无;'所以装载机正在运行,并没有下车 – Lindow

0

我会做一个缓存/数据访问层的逻辑。当另一个函数完成时,可以使用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 = {};

相关问题