首页 文章

无法在Wordpress中使用smoothState.js读取未定义的属性'addClass'

提问于
浏览 次
0

我正在尝试将smoothState.js实现为自定义WordPress主题 . 我很沮丧 . 根据smoothState文档，我觉得我的代码是正确的，但它仍然会产生错误 . 但我仍然是JS / JQuery的初学者和一般的脚本，所以我可能会遗漏一些东西 .

在noConflict模式下使用JQMigrate版本1.4.1和JQuery 1.12.4 . WordPress是4.6.1 .

jQuery(document).ready(function($){ // WordPress doesn't release $ so we need this line
$(function() {
    var $body = $('html, body'),
    content = $('#wrapper').smoothState({
        prefetch: true,
        pageCacheSize: 4,
        debug: true,
        // onStart is for when a link is clicked
        onStart: {
            duration: 2500, // animation duration in ms
            render: function (url, $container) {
                $container.addClass('is-exiting');
                $body.animate({
                    scrollTop: 0
                });
                smoothState.restartCSSAnimations();
            }
        },
        onEnd : {
            duration: 1500, \
            render: function (url, $container, $content) {
                $container.removeClass('is-exiting');
                $body.css('cursor', 'auto');
                $body.find('a').css('cursor', 'auto');
                $container.html($content);
                // Trigger document.ready and window.load
                $(document).ready();
                $(window).trigger('load');
            }
        },
        onAfter : function(url, $container, $content) {

        }
    }).data('smoothState');
});

(function($, undefined) {
    var isFired = false;
    var oldReady = jQuery.fn.ready;
    $(function() {
        isFired = true;
        $(document).ready();
    });
    jQuery.fn.ready = function(fn) {
        if(fn === undefined) {
            $(document).trigger('_is_ready');
            return;
        }
        if(isFired) {
            window.setTimeout(fn, 1);
        }
        $(document).bind('_is_ready', fn);
    };
})(jQuery);

});

单击#wrapper中的任何超链接会引发以下控制台错误...

Uncaught TypeError: Cannot read property 'addClass' of undefined
    w @ jquery.smoothState.min.js:9
    b @ jquery.smoothState.min.js:9
    dispatch @ jquery.js?ver=1.12.4:3
    r.handle @ jquery.js?ver=1.12.4:3

我've checked for any potential plugin or theme conflicts and found none. I'甚至试过明确宣布容器如 var $container = $("#wrapper"); 但仍然得到相同的结果 . 有任何想法吗？

javascript jquery wordpress smoothstate.js

1 回答

  • 0

    在查看smoothState onStart documentation之后，渲染函数似乎只接受一个参数，如下所示：

    $('#main').smoothState({
  onStart: {
    // How long this animation takes
    duration: 0,
    // A function that dictates the animations that take place
    render: function ($container) {}
  }
});

    你的代码有两个：

    render: function (url, $container) {

    这可能会导致渲染函数url参数设置为$ container，因为它是传递的第一个参数，$ container参数是未定义的，因为参数永远不会传递/设置 . 因此，当你打电话：

    $container.addClass('is-exiting');

    您收到错误：

    Cannot read property 'addClass' of undefined

    因为$ container不是对象 .

    回复于

相关问题