按下后退并调用历史记录后(）;History.pushstate没有实例化/不起作用

After pressing back and calling history.back(); History.pushstate isn't instantiated / not working

本文关键字：pushstate History 实例化 不起作用 调用 历史 记录      更新时间：2023-09-26

所以，我正在使用历史.js来创建某种影响历史状态的弹出模式。我正在加载jquery和历史记录.js一切似乎都工作正常，直到我在浏览器中按回键，加载一个页面，然后用鼠标关闭弹出窗口，而不是历史记录不起作用并且 history.pushstate 返回 null。

这是我的JavaScript代码：

`var urlPath;`

(function(window,undefined){ History.Adapter.bind(window,'statechange',function() { var State = History.getState(); if(State.data.action == "show_popup"){ $('html, body').css({ 'overflow': 'hidden' }); $('.lightbox-dimmer').fadeIn(); $('.lightbox-dimmer').focus(); $('.lightbox-load').fadeIn(); $("#lightbox").load(urlPath+' .halfpage, .sidepage', function() { $('.lightbox-load').fadeOut(); $('.lightbox-warp').fadeIn(); $('.lightbox-dimmer').click(function(event){ if ((!$(event.target).closest('.post-info').length && !$(event.target).closest('.post-auth').length)) { $('.lightbox-dimmer').unbind(); History.back(); } }); }); }else{ History $('html, body').css({ 'overflow': 'auto' }); $('.lightbox-dimmer, .lightbox-warp').fadeOut(); $('.lightbox-dimmer').scrollTop(0); } });

    $('.post-image').click(function(){
        urlPath = $(this).attr('href');
        if (History.pushState({ action: 'show_popup' } , 'POST TITLE', urlPath)) {
            alert('pizza')
        }
        var State = History.getState();
        return false;
    });
})(window);`

设法修复了它...

$(document).ready(function(){
$('.post-image img').lazyload({
    effect : "fadeIn"
});
var $container = $('.posts');
$container.imagesLoaded( function() {
    $container.masonry({
        itemSelector: '.post',
        isOriginLeft: false
    });
});
$('.post-image').click(function(){
    var urlPath = $(this).attr('href');
    History.pushState({state:1}, "State 1", urlPath); //,rand:Math.random()
    return false;
});
});
(function(window,undefined){
var History = window.History;
var State = History.getState();
History.Adapter.bind(window,'statechange',function(){
    var State = History.getState();
    alert(State.data.state);
    if(State.data.state == 1){
        $('html, body').css({
            'overflow': 'hidden'
        });
        $('.lightbox-dimmer').fadeIn();
        $('.lightbox-dimmer').focus();
        $('.lightbox-load').fadeIn();
        $("#lightbox").load(State.url+' .halfpage, .sidepage', function() {
            $('.lightbox-load').fadeOut();
            $('.lightbox-warp').fadeIn();
            $('.lightbox-dimmer').one('click', function(event){
                if ((!$(event.target).closest('.post-info').length && !$(event.target).closest('.post-auth').length))  {
                    History.pushState({state:2}, "State 2", '/');
                }
            });
        });
    }else{
        $('html, body').css({
            'overflow': 'auto'
        });
        $('.lightbox-dimmer, .lightbox-warp').fadeOut();
        $('.lightbox-dimmer').scrollTop(0);
    }
});
})(window);
相关文章：