1

Web サイトで JavaScript または jQuery を使用して、ブラウザー セッション中に 1 回だけ広告バナーを表示するにはどうすればよいですか? セッションが閉じられてブラウザーが閉じられると、ブラウザーで Web サイトを再度開くと、広告が再び表示される必要があります。もう1つ、Webサイトのバナーをナビゲートするときに、閉じていない限り表示する必要があります。

4

4 に答える 4

2

使用するsessionStorage

このsessionStorageプロパティを使用すると、 にアクセスできますsession Storage object。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 に答える
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 に答える
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 に答える