不要在後退導航中顯示模式彈出

我有一個模式彈出窗口，只在主頁上顯示頁面加載。當我導航到另一個頁面，然後返回到主頁時，彈出窗口再次顯示。我只想讓彈出窗口在用戶的計算機上顯示一次，而不管他們返回主頁多少次。當瀏覽器關閉然後重新打開並且用戶再次進入網站時，只有這樣彈出窗口才能再次顯示。這可能不使用會話或數據庫？不要在後退導航中顯示模式彈出

HTML代碼：

<div class="modal fade" id="defaultModal" tabindex="-1" role="dialog" aria-labelledby="defaultModalLabel" aria-hidden="true"> 
<div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
      <h4 class="modal-title" id="defaultModalLabel">Default Modal Title</h4> 
     </div> 
     <div class="modal-body"> 
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc <a href="#">vehicula</a> lacinia. Proin adipiscing porta tellus, ut feugiat nibh adipiscing sit amet. In eu justo a felis faucibus ornare vel id metus. Vestibulum ante ipsum primis in faucibus.</p> 
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur pellentesque neque eget diam posuere porta. Quisque ut nulla at nunc <a href="#">vehicula</a> lacinia. Proin adipiscing porta tellus, ut feugiat nibh adipiscing sit amet. In eu justo a felis faucibus ornare vel id metus. Vestibulum ante ipsum primis in faucibus.</p> 
     </div> 
     <div class="modal-footer"> 
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
     </div> 
    </div> 
</div>

JavaScript代碼：

$(window).load(function(){ 
    $('#defaultModal').modal('show'); 
});

來源

2016-08-17 Damian

你知道window.sessionStorage嗎？

// Save data to sessionStorage 
 
sessionStorage.setItem('key', 'value'); 
 

 
// Get saved data from sessionStorage 
 
var data = sessionStorage.getItem('key');

您可以瞭解here

可以使用的sessionStorage這一點。

當用戶第一次進入主頁時>設置sessionStorage變量並顯示模態。
當用戶在導航到其他頁面後回到主頁時，請檢查sessionStorage，因爲它仍將被設置，不顯示模式。
當用戶關閉瀏覽器（或選項卡）時，會清除sessionStorage並再次瀏覽主頁將顯示模式。

所以，你的js代碼將是這樣的：

$(window).load(function(){ 
 
    
 
    if(sessionStorage.getItem('homePageAlreadyVisited') == null)//The first time this will be null 
 
    { 
 
     sessionStorage.setItem('homePageAlreadyVisited', 'foobar'); //foobar can be anything. You are just concerned about checking whether 'homePageAlreadyVisited' key has some value or not. 
 
     $('#defaultModal').modal('show'); 
 
    } 
 
//now coming back to the homepage after navigating to some other pages will not execute anything as this time, if statement is false. 
 
});

來源

2016-08-17 14:02:05

必須通過sessionStorage的考慮導航版本grather比IE8 – Joaquinglezsantos

我不知道，如果我跟着你，但如果你是說windowStorage（會話或本地）只支持IE8或更高版本，那麼我同意。我認爲這不是一個問題，因爲模式本身不適合於低於8的IE版本。 –

現在適用於所有導航器。 IE版本少於8只有問題 – Joaquinglezsantos

可能設置cookie第一次用戶訪問的網站？只顯示模式，如果cookie尚未設置。

要在用戶關閉瀏覽器時丟失cookie，您可以這樣做：設置一個非常短的時間間隔，並以較短的生命週期更新cookie。即使我不會推薦這個策略，因爲它創造了一個JavaScript執行的整個拳頭，我認爲它應該工作。

編輯：如果它可以讓你讓間隔運行不太頻繁，我想你可以去爲它。也許每分鐘試一次？另外不要忘記在每個頁面上運行「更新」功能！

來源

2016-08-17 13:56:44

不使用會話或cookie是不可能的。如果您不想使用php_sessions（或c＃或其他），則可以使用this jQuery plugin創建會話

來源

2016-08-17 13:58:08

確認何時打開模式。也許在用戶第一次進入主頁時使用url上的內容。

來源

2016-08-17 13:58:13

不要在後退導航中顯示模式彈出

回答

相關問題