Question

我在我的网站上使用了插件smoothstate.js。出于某种原因，当我使用后退和前进按钮浏览页面时，后退按钮会一直停止工作。

网址有所变化，但内容保持不变吗？

我已检查控制台是否显示错误：

TypeError: Cannot read property 'state' of undefined

有谁知道为什么会这样？就像我说的那样，大多数情况下它的工作正常，但突然之间并没有。

我使用的代码是这样的：

$(function(){
  'use strict';
  var options = {
    prefetch: true,
    debug:true,
    cacheLength: 0,
    repeatDelay: 500,


    onStart: {
      duration: 0, // Duration of our animation
      render: function ($container) {
        // Add your CSS animation reversing class
        $container.addClass('is-exiting');

        // Restart your animation
        smoothState.restartCSSAnimations();
      }
    },

    onProgress: {
    // How long this animation takes
    duration: 0,
    // A function that dictates the animations that take place
    render: function ($container) {
                    $container.addClass('is-loading');

                    $('#progressBar').append('<div id="bar"></div>');   
                    var progress = '100%';

                    $('#bar').animate({
                        width: progress
                    }, 400);
    }
    },

    onReady: {
      duration: 0,
      render: function ($container, $newContent) {
        $container.removeClass('is-loading is-exiting');
        // Inject the new content
        $container.html($newContent);
      },
    },

    onAfter: function() {
            navbarAnimate();
            closeMenu();
            ImageSliders();
            initPhotoSwipeFromDOM('.gallery');
            ImageOverlay(); 
            window.parsePinBtns();
            backToTop();

    }
  },


  smoothState = $('#main').smoothState(options).data('smoothState');
});

Answer 1

我也遇到了这个问题，当没有完全加载页面时，单击后退和前进按钮的速度太快时，就会发生此问题。对于我来说，一个有问题的解决方案是，如果未定义page.cache [page.href]，则重新加载页面。

/** Handles the popstate event, like when the user hits 'back' */
onPopState = function(e) {
  if(e.state !== null || typeof e.state !== undefined) {
    var url = window.location.href;
    var $page = $('#' + e.state.id);	
    var page = $page.data('smoothState');
	
	if (typeof(page.cache[page.href]) !== 'undefined') {
		var diffUrl = (page.href !== url && !utility.isHash(url, page.href));
		var diffState = (e.state !== page.cache[page.href].state); 

		if(diffUrl || diffState) {
		  if (diffState) {
			page.clear(page.href);
		  }
		  page.load(url, false);
		}
	}
	else {
		//reload the page if page.cache[page.href] is undefined
		location.reload();
	}
    
  }
},

smoothstate.js - 后退按钮有时不起作用？

1 个答案: