限制引導模式

我使用引導模式在我的網站上展示我的特別優惠。但是每次頁面刷新時都會彈出此模式。如何限制此模式只出現一次？限制引導模式

<!-- Modal start--> 
<div class="container"> 
<div class="modal fade" id="myModal" role="dialog"> 
<div class="modal-dialog"> 
<div class="modal-content"> 
<div class="modal-header">/* header part */ 
<button type="button" class="close" data-dismiss="modal">&times;</button> 
</div> 
<div class="modal-body">/* Body part */ 
Some text 
</div> 
     </div> 
     <div class="modal-footer">/* Footer part */ 

      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
     </div> 
    </div> 
</div> 
</div>` This is the code used for the modal. What change do i need to make to make the modal pop up just once , rather than appearing on every page refresh??` 
</div> 
<script> 
$(document).ready(function(){ 
    $("#myModal").modal(); 
}); 
</script>

來源

2016-07-08 Dhanush GR

使用cookie和存儲，是彈出窗口顯示。檢查cookie。 – vaso123

使用cookie或本地存儲 –

默認情況下，每次頁面加載時都會調用文檔就緒功能，這就是每次刷新頁面時都會彈出模式的原因。 –

只是刪除這樣：

<script> 
$(document).ready(function(){ 
    $("#myModal").modal(); 
}); 
</script>

如何可以切換（隱藏/顯示）的模式：

$('#myModal').modal('show') 
$('#myModal').modal('toggle') 
$('#myModal').modal('hide')

文檔：

http://getbootstrap.com/javascript/#modals

如果你想要的是模態中只能出現一次，我建議jQuery的餅乾：

https://plugins.jquery.com/cookie/

非常簡單的使用方法：

<script> 
$(document).ready(function(){ 

    if(!$.cookie('customer.offers.seen') { 
     $("#myModal").modal(); 
     $.cookie('customer.offers.seen', true); 
    } 

}); 
</script>

來源

2016-07-08 11:19:20 pleinx

通過使用餅乾嘗試以下

<script> 
$(document).ready(function(){ 
    $("#myModal").modal(); 
}); 
</script>

到

<script> 
$(document).ready(function(){ 
    var pop_up_show = $.cookie("pop_up_show"); 
    if(typeof pop_up_show != "undefined" && pop_up_show == "1"){ 

    }else{ 
     $.cookie("pop_up_show", "1"); 
     $("#myModal").modal();  
    } 

}); 
</script>

來源

2016-07-08 11:23:05

你可以使用HTML5 的sessionStorage存儲的數據只有一個會話。基本上它與瀏覽器選項卡一起生活。如果用戶仍然在那裏刷新它，但是如果它們關閉了其刪除的選項卡。

<script> 
    $(document).ready(function(){ 
     if (sessionStorage.getItem("loaded") === null) { 
      sessionStorage.setItem("loaded", "loaded"); 
      $("#myModal").modal(); 
     } 
    }); 
</script>

來源

2016-07-08 11:27:36

限制引導模式

回答

相關問題