Не показывать модальное всплывающее окно на обратной навигации

Question

У меня есть модальное всплывающее окно, которое отображается на странице только на главной странице. Когда я перехожу на другую страницу, а затем обратно на домашнюю страницу, всплывающее окно снова отображается. Я хочу, чтобы всплывающее окно отображалось только на компьютере пользователя, независимо от того, сколько раз они переходят на главную страницу. Когда браузер закрыт, а затем снова откроется, и пользователь снова войдет на веб-сайт, только после этого всплывающее окно снова появится. Возможно ли это без использования сеансов или базы данных?

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'); 
}); 

Answer 1

Знаете ли вы о window.sessionStorage ??

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

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

Вы можете узнать о том, что here

Вы можете использовать sessionStorage для этого.

1. Когда пользователь впервые приходит на домашнюю страницу => устанавливает переменную sessionStorage и отображает модальный.
2. Когда пользователь возвращается на домашнюю страницу после перехода на некоторые другие страницы, проверьте sessionStorage, так как он все равно будет установлен, не отображается модальный.
3. Когда пользователь закрывает браузер (или вкладку), 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. 
 
});

Answer 2

Может быть установлен печенье в первый раз пользователь посещает сайт? И покажите только модальный, если cookie еще не установлен.

Чтобы потерять файл cookie, когда пользователь закрывает браузер, вы можете сделать это: Настройте очень короткий интервал и часто обновляйте файл cookie с коротким сроком службы. Несмотря на то, что я бы не рекомендовал эту стратегию, поскольку он создает целый кусок javascript-исполнения, я думаю, что он должен работать.

EDIT: Если это нормально, вы позволяете интервалу работать менее часто, я думаю, вы можете пойти на это. Может быть, попробовать каждую минуту? Также не забудьте запустить функцию «возобновить» на каждой странице!

Answer 3

Без использования сеансов или файлов cookie это невозможно. Если вы не хотите использовать php_sessions (или C# или что-то еще), вы можете использовать this jQuery plugin для создания сеанса

Answer 4

Сделайте валидацию, когда следует открыть модальную. Возможно, используя что-то на url при первом входе пользователя на домашнюю страницу.