Кнопка Back браузера ломает скрипт. Как полечить?
В общем, есть скрипт offcanvas окна для корзины/фильтров.
С любой страницы магазина/категории/товара вызываю окно и перехожу по ссылке на страницу корзины, после чего жму в браузере Back, и на html, body
вешается класс .noscroll
, как будто окно вызвано и активно, при этом кнопки вызова окна не реагируют.
Если с главной страницы перейти и вернуться — окно активно и работает.
Ссылка на тему: https://maudern.thunder-stores.com/shop/
(function($) {
"use strict";
// open shop filters.
$( document ).on(
'click touch',
'.woocommerce .woocommerce-product-loop-header .woocommerce-product-filters span.filters-toggle.offcanvas-filters-toggle',
function(){
$( 'html, body' ).addClass( 'noscroll' );
$( '.offcanvas.offcanvas-shop-filters' ).addClass( 'open' );
$( '.overlay' ).addClass( 'visible right' ).removeClass( 'delay' );
}
);
// open minicart.
$( document ).on(
'click touch',
'#site-header #secondary-menu-wrapper ul#menu-site-tools > li#shopping-bag-site-tool',
function(){
$( 'html, body' ).addClass( 'noscroll' );
if ( $( document ).find( '#site-header' ).hasClass( 'search-open' ) ) {
// close search form.
$( '#site-header #secondary-menu-wrapper ul#menu-site-tools > li#search-site-tool' ).removeClass( 'active' );
$( '.overlay' ).removeClass( 'visible' );
setTimeout(
function() {
$( '#site-header' ).removeClass( 'search-open' );
},
200
);
setTimeout(
function() {
$( '.offcanvas.offcanvas-minicart' ).addClass( 'open' );
$( '.overlay' ).addClass( 'visible right' );
},
800
);
} else {
$( '.offcanvas.offcanvas-minicart' ).addClass( 'open' );
$( '.overlay' ).addClass( 'visible right' ).removeClass( 'delay' );
}
}
);
$( document.body ).on(
'added_to_cart',
function(){
$( '#site-header #secondary-menu-wrapper ul#menu-site-tools > li#shopping-bag-site-tool' ).trigger( 'click' );
}
);
// close offcanvas.
$( document ).on(
'click touch',
'.overlay, .offcanvas-close',
function(){
$( 'html, body' ).removeClass( 'noscroll' );
$( '.offcanvas' ).removeClass( 'open' );
$( '.overlay' ).removeClass( 'visible right left' ).addClass( 'delay' );
}
);
// close offcanvas on link click.
$( document ).on(
'click touch',
'.offcanvas a',
function(){
// check for internal links.
if ( ! $( this ).attr( 'href' ).startsWith( '#' ) &&
! $( this ).attr( 'href' ).startsWith( '/' ) &&
! $( this ).attr( 'href' ).startsWith( './' ) &&
! $( this ).attr( 'href' ).startsWith( '../' ) &&
! $( this ).attr( 'href' ).startsWith( $( location ).attr( "href" ) ) &&
! $( this ).hasClass( 'remove' ) ) {
// hide offcanvas.
$( '.offcanvas' ).hide();
// hide overlay.
$( '.overlay' ).hide();
}
}
);
})( jQuery );
Вот это не помогло.
add_action( 'wp_print_footer_scripts', function () {
?>
<script>
(function clearNoscroll() {
$(window).on('popstate', function() {
$('html, body').removeClass('noscroll');
});
})();
</script>
<?php
} );
Как полечить такое?
Источник: Stack Overflow на русском