1

如何在网站中使用 JavaScript 或 jQuery 在浏览器会话期间仅显示一次广告横幅?一旦会话关闭并关闭浏览器,当我再次在浏览器中打开网站时,广告必须再次显示。当我浏览网站横幅时,还有一件事必须显示,除非它没有关闭。

4

4 回答 4

2

您可以使用 cookie 来记住广告是否显示。

你可以使用这个插件:https ://github.com/carhartl/jquery-cookie

制作显示广告的方法:

showAd() {
 // cookie not set, display the ad and set the cookie
 if($.cookie('adDisplayed') === 'undefined') {
   // code to display the add
   // .....
   // set cookie
   $.cookie('adDisplayed', '1', { expires: 7 }); // set the cookie

 }
} 

要在用户离开页面时销毁 cookie,请绑定 beforeunload 事件

$(window).bind("beforeunload", function() { 
    $.removeCookie('adDisplayed'); 
})
于 2016-07-03T10:01:56.280 回答
2

利用sessionStorage

sessionStorage属性允许您访问session Storage object. sessionStorage 和 sessionStorage 类似Window.localStorage,唯一的区别是存储的数据localStorage没有设置过期时间,当页面会话结束时,存储的数据sessionStorage会被清除。只要浏览器打开并在页面重新加载和恢复后仍然存在,页面会话就会持续。

在新选项卡或窗口中打开页面将导致启动新会话,这与会话 cookie 的工作方式不同。

var banner = document.getElementById('banner');
if (sessionStorage.getItem('set') === 'set') {
  banner.style.display = 'none';
} else {
  sessionStorage.setItem('set', 'set');
}
#banner {
  width: 320;
  height: 50px;
  background: green;
  text-align: center;
}
<div id="banner">Banner</div>

小提琴演示

于 2016-07-03T09:56:03.173 回答
1

您可以使用此处解释的fadeIn()fadeOut()方法

像这样 :

var myVar = setInterval(myTimer, 1000);

function myTimer() {
    $("#banner").fadeOut();
}

https://jsfiddle.net/bc8jgoga/

于 2016-07-03T11:03:24.613 回答
1

您可以使用 JavaScript 设置 cookie 以记住访问。

例子

<div id="banner"></div>
<script>
  if(typeof $.cookie("banner") === 'undefined' || $.cookie("banner") != "1") {
      $("#banner").html("My Banner");
      $.cookie("banner", "1");
  }
  window.addEventListener("beforeunload", function (e) {
      $.removeCookie("banner");
  });
</script>
于 2016-07-03T09:52:41.080 回答