如何只加载一次jquery

时间:2017-03-15 12:58:47

标签: javascript jquery html

我想在我的网站标题中看到一个横幅,它出现在第一个用户进入网站的位置。 html结构如下所示:

   <div class="mobilebanner">
        <div class="mobilebanner-container">
            <div class="left-box">
                <div class="image">
                    <img src="<?php bloginfo( 'template_url' ); ?> /images/sample.jpg" alt="">
                </div>
                <div class="text">
                    <h4>The New Yorker Today</h4>
                    <p>Conde Nast Digital</p>
                    <div class="review-stars">
                        <p>starts willlbe here</p>
                    </div>
                    <p>GET - On the App Store</p>
                </div>
            </div>
            <div class="right-box">
                <div class="view">
                    <a href="www.gmail.com">View</a>
                </div>
            </div>
        </div>
    </div>

当我点击图片时,横幅必须消失,并且只有在24小时后用户访问网站时才会再次显示。

希望有人可以帮助我从my pen here

实现这一目标

提前致谢。

2 个答案:

答案 0 :(得分:0)

这不是完整的代码。但是它会让你达到你想要做的。

window.onload = function() {
  if(localStorage.getItem('timestamp')) {
     var timestampDate = new Date(parseInt(localStorage.getItem('timestamp'));
     if(timestampDate + 24*60*60*1000 < new Date().getTime()) { // one day over
         showBanner();
     }
  } else {
    // first visit
    localStorage.setKey('timestamp', new Date().getTime());
    showBanner();
  }
};

showBanner()函数中显示您的横幅。

答案 1 :(得分:0)

使用localStorage并将24小时作为约束

<script>
if (localStorage.firsttime==1)
{
var currenttime=new Date().getTime();
var firstvisittime=localStorage.visittime;
var difference=currenttime-firstvisittime;

var hoursDifference = Math.floor(difference/1000/60/60);
if( hoursDifference>24)
{
localStorage.firsttime=0;
} 

}

if(localStorage.firsttime==undefined||localStorage.firsttime==0)
{
localStorage.firsttime=1;
localStorage.visittime=new Date().getTime();
} 


</script>