2017-05-31 21 views
-1

這是popup-up div,它的工作良好。但是,每次刷新瀏覽器和我想要的內容時都會加載它?當用戶打開我的網站時,我只需要這一次。我想在整個網站上創建彈出div一次性負載

任何想法如何控制這一點。僅供參考,這是magento-2彈出窗口。

require(
 
    [ 
 
    'jquery', 
 
    'Magento_Ui/js/modal/modal' 
 
    ], 
 
    function(
 
    $, 
 
    modal 
 
) { 
 
    var options = { 
 
     type: 'popup', 
 
     responsive: true, 
 
     innerScroll: true, 
 
     //title: 'popup modal title', 
 
     buttons: [{ 
 
     text: $.mage.__('Continue'), 
 
     class: '', 
 
     click: function() { 
 
      this.closeModal(); 
 
     } 
 
     }] 
 
    }; 
 

 
    var popup = modal(options, $('#popup-modal')); 
 

 
    $('#popup-modal').modal('openModal'); 
 
    } 
 
); 
 

 
$(document).ready(function() { 
 
    $(".actions").click(function() { 
 
    alert("The paragraph was clicked."); 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="popup-modal"> 
 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> 
 
    <h1>Subscribe for Our <span>exclusive offer</span></h1> 
 
    <p>Be the first to know about new arrivals exclusive offers and promotions</p> 
 
    <?php echo $block->getLayout()->createBlock('Magento\Newsletter\Block\Subscribe')->setTemplate('subscribe.phtml')->toHtml();?> 
 
</div>

+0

你可以存儲一些數據的localStorage或者使用與用戶會話相關聯beckEnd標誌。並檢查它在document.ready – Sabik

+0

檢查這一個http://www.jqueryscript.net/lightbox/jQuery-Plugin-To-Show-A-Popup-Only-Once-Per-Visitor-First-Visit-Popup.html –

回答

0

由於正常的JavaScript(實際上的NodeJS工作服務器端)只處理客戶端操作(即瀏覽器),它不能「記住」的彈出了一個網頁後顯示一次重裝。 JavaScript需要某種幫助。關鍵是你不需要關心JavaScript的部分,但在這種情況下更多關於PHP。

1 .:您可以將此信息保存在cookie中,如果彈出窗口只顯示一次,cookie可以保存信息。唯一的缺點是,當你清除瀏覽器cookies時,彈出窗口會再次出現。

2 .:你可以讓MySQL數據庫永久存儲這些信息。因此,您將需要您自己的自定義模塊。好的例子可以在搜索中找到。

我的建議是如果您還沒有創建自己的模塊,並使用您的信息爲客戶擴展數據庫表。

希望這可以幫助你走向正確的方向。

0

添加cookie有一些與CREATE,READ和REMOVE cookie相關的功能,請查找此fiddle或更低的片段以獲取更多信息。

我希望它會幫助你

function createCookie(name,value,days) { 
 
     if (days) { 
 
      var date = new Date(); 
 
      date.setTime(date.getTime() + (days*24*60*60*1000)); 
 
      var expires = "; expires=" + date.toUTCString(); 
 
     } 
 
     else var expires = ""; 
 
     document.cookie = name + "=" + value + expires + "; path=/"; 
 
    } 
 

 
    function readCookie(name) { 
 
     var nameEQ = name + "="; 
 
     var ca = document.cookie.split(';'); 
 
     for(var i=0;i < ca.length;i++) { 
 
      var c = ca[i]; 
 
      while (c.charAt(0)==' ') c = c.substring(1,c.length); 
 
      if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length); 
 
     } 
 
     return null; 
 
    } 
 

 
    function eraseCookie(name) { 
 
     createCookie(name,"",-1); 
 
    } 
 

 
    $(function(){ 
 
    
 
     if(readCookie('OnlyONCE') == null) 
 
     { 
 
     $('#popup-modal').modal('openModal'); 
 
     createCookie('OnlyONCE','true',7); 
 
     } 
 
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="cookie" style="display:none;">POP UP 
 
    <a href="#" class="cookie-close"> 
 
    <span class="icon" onclick='onClose()'>X</span> 
 
    </a> 
 
</div>

+0

Curiousdev @你能用管理這個問題 – sanjay

+0

@sanjay你是什麼意思'管理'? – Curiousdev

+0

Curiousdev @主要問題是如何使用'$('#popup-modal')。modal('openModal');代碼 – sanjay

相關問題