История браузера Как перейти по раннее открытой ссылке кликом по кнопке браузера «вперед»?

Question

[Чёкатилло]

В общем, открывается окно - в нем подгружаются посты - закрывается окно по клику/либо стрелкой браузера "назад"
После этого стрелка браузера "вперед" остается активной
Если нажать на нее, то ссылка просто изменится, но на пост этой ссылки не пройдет

Так меняется ссылка:

if(url != window.location){
            window.history.pushState(null, null, url);
        }

Так меняется ссылка обратно, по закрытию окна:

var window_location = window.location.href;
   function Popupclose() {

   }

А так закрывается окно по клику на кнопку "назад":

window.addEventListener('popstate', function(e) {

});

После этого волшебства, кнопка браузера "вперед" активна и может изменять ссылку без перехода по ней

Как осуществить один из вариантов:

- Кнопку "вперед" сделать не активной по закрытию попап
- Кнопку оставлять активной, а по клику по ней проходить на пост
- Кнопку, так же, оставлять активной, но по клику открывать окно с постом по имеющейся ссылке

Весь скрипт мадального окна:

spoiler

//ПОДГРУЗКА ПОПАП

	function loadContents() {
		var url = $('#page-nav a').attr('href');
		if (url) {
    $( ".popup-loader" ).show("slow");
			$.ajax({
				type: "GET",
				url: url,
				dataType: "html",
				success: function (loaded) {
					var result = $(loaded).find('#content_masonry .loop');
					var nextlink = $(loaded).find('#page-nav a').attr('href');
					$(loaded).imagesLoaded(function() {
						$container.append(result).masonry('appended', result);
						$('.popup-post-modal-open').bind('click', DimaPopup);

					});

    $( ".popup-loader" ).hide("slow");
					if (nextlink != 'undefined') {
						$('#page-nav a').attr('href', nextlink);
					} else {
						$('#page-nav').remove();
					}
					loading = false;
				}
			});
		}
	}

    $('.popup-post-modal-open').bind('click', DimaPopup);
    $('.popup-background').bind('click', Popupclose);

    function DimaPopup(e){
      e.preventDefault();
        
        $('.popup-background').css('opacity', '1');
        $('.popup-background').css('visibility', 'visible');

      var url = $(this).attr('href');

        // А вот так просто меняется ссылка
        if(url != window.location){
            window.history.pushState(null, null, url);
        }
     
      $('.popup-loader').fadeIn(100);
      $('.popup-post').addClass('active');
      window.setTimeout(function(){$('.popup-post').scrollTop(0);},50);
      $('#content_owerflow').addClass('active');
      $('body').addClass('active2');

    $.ajax(
    {
       type : 'POST',
       url : 'https://' + location.host + '/wp-admin/admin-ajax.php',
       data: { action: 'popup_post', popup_post_id:$(this).parents('.title').children('.post-click-popup').children('span').text()
    },
       success: function(data){                   
        $('.post-generat-content').eq(0).html(data);
        $('.popup-loader').fadeOut(100);


             $('.close').bind('click', Popupclose);
             },
             error: function(error)
             {
             console.log('Ошибка');
             }
    });
   }
   var window_location = window.location.href;
   function Popupclose() {
      $('.popup-background').css('opacity', '0');
      $('.popup-background').css('visibility', 'hidden');
      $('.popup-post').removeClass('active');
      window.history.pushState(null, null, window_location);
      $('#content_owerflow').removeClass('active');
      $('body').removeClass('active2');
   }
      window.addEventListener('popstate', function(e) {
      $('.popup-background').css('opacity', '0');
      $('.popup-background').css('visibility', 'hidden');
      $('.popup-post').removeClass('active');
      $('#content_owerflow').removeClass('active');
      $('body').removeClass('active2');
      var url = $(this).attr('href');
        if(url != window.history.back){
            window.history.pushState(null, null, null);
      }
});

Спасибо за внимание!

Answer 1

[Чёкатилло]

Ну вот так вроде не изменяется ссылка при клике "назад" при закрытии окна:

window.addEventListener('popstate', function(e) {
      $('.popup-background').css('opacity', '0');
      $('.popup-background').css('visibility', 'hidden');
      $('.popup-post').removeClass('active');
      $('#content_owerflow').removeClass('active');
      $('body').removeClass('active2');
      var url = $(this).attr('href');

        if(url != window.history.back){
            window.history.pushState(null, null, null);
        }
});

Это подходит Достаточно сделать кнопку "вперед" неактивной при закрытии попап

Но правильно ли это все?

Сомневаюсь не просто, потому что я не профессионал, а потому что ИНОГДА при закрывании окна стрелкой "назад", кнопка "лоадер" браузера дергается, как будто происходит сначала неопределенный конфликт, а затем "лоадер" доходит в нужное состояние