使用Search&Go在子主题(ReferenceError)中加入WP_ENQUEUE脚本

时间:2016-06-28 作者:Pim Heijden

This is my first post here, so I hope I pasted the code well and you\'ll stand by interpreting the problem.

I have deregistered and dequeued two scripts in my childtheme. When removing and adding only the first script (listing.js) all works fine, no problem. But when I also remove and add more script the page becomes dysfunctional and I get reference errors.

Here\'s a screenshot of what my debug plugin gives me

Here\'s the relevant part of my functions.php in childtheme:

    function remove_script() {
    wp_deregister_script( \'search_and_go_elated_listings\' );
    wp_dequeue_script(  \'search_and_go_elated_listings\' );

    wp_deregister_script( \'search_and_go_elated_third_party\' );
    wp_dequeue_script(  \'search_and_go_elated_third_party\' );

    wp_deregister_script( \'search_and_go_elated_modules\' );
    wp_dequeue_script(  \'search_and_go_elated_modules\' );

    wp_deregister_script( \'search_and_go_elated_blog\' );
    wp_dequeue_script(  \'search_and_go_elated_blog\' );

    wp_deregister_script( \'eltd-like\' );
    wp_dequeue_script(  \'eltd-like\' );
}
add_action( \'wp_print_scripts\', \'remove_script\', 20 );

function add_script() {
    wp_enqueue_script( \'bijles_search_and_go_elated_listings\', get_stylesheet_directory_uri() . \'/assets/js/listings.js\', array(\'jquery\', \'underscore\', \'jquery-ui-autocomplete\'), false, true );
    wp_enqueue_script( \'bijles_search_and_go_elated_third_party\', get_stylesheet_directory_uri() . \'/assets/js/third-party.min.js\', array(\'jquery\'), false, true  );
    wp_enqueue_script( \'bijles_search_and_go_elated_modules\', get_stylesheet_directory_uri() . \'/assets/js/modules.js\', array(\'jquery\'), false, true  );
    wp_enqueue_script( \'bijles_search_and_go_elated_blog\', get_stylesheet_directory_uri() . \'/assets/js/blog.min.js\', array(\'jquery\'), false, true  );
    wp_enqueue_script( \'bijles_eltd-like\', get_stylesheet_directory_uri() . \'/assets/js/like.min.js\', array(), false, true  );
};
add_action( \'wp_enqueue_scripts\', \'add_script\', 100);

Similar but unanswered question can be found here:

Hope you all can help me out. I\'ve been learning but can\'t figure this out myself!

ADDED (29-6-2016):

This is what I found searching for "search_and_go_elated_listings" in parent theme. functions.php:

if ( ! function_exists( \'search_and_go_elated_listing_assets\' ) ) {

    function search_and_go_elated_listing_assets() {

        wp_enqueue_style( \'search_and_go_elated_listings\', ELATED_ASSETS_ROOT.\'/css/listings.min.css\' );
        wp_enqueue_script( \'search_and_go_elated_listings\', ELATED_ASSETS_ROOT.\'/js/listings.min.js\', array(\'jquery\', \'underscore\', \'jquery-ui-autocomplete\'), false, true );

        if(search_and_go_elated_is_responsive_on()) {
            wp_enqueue_style( \'search_and_go_elated_listings_responsive\', ELATED_ASSETS_ROOT.\'/css/listings-responsive.min.css\' );
        }

    }

    add_action( \'wp_enqueue_scripts\', \'search_and_go_elated_listing_assets\' );

}

This is what I found searching for "search_and_go_elated_modules" in parent theme:

wp_enqueue_script(\'search_and_go_elated_modules\', ELATED_ASSETS_ROOT.\'/js/modules.min.js\', array(\'jquery\'), false, true);

Besides wp_enqueue_script, I also found a couple of instances of wp_localize_script for this handle.

Hope this helps!

ADDED (30-6-2016):

In parent wp_localize_script is used 6 times in framework belonging to the theme, which I will not post for now. It is used twice in functions.php, were we also see "eltdGlobalVars", which is mentioned in one of the errors. Please see below:

if(!function_exists(\'search_and_go_elated_get_global_variables\')) {
    /**
     * Function that generates global variables and put them in array so they could be used in the theme
     */
    function search_and_go_elated_get_global_variables() {

        $global_variables = array();
        $element_appear_amount = -150;

        $global_variables[\'eltdAddForAdminBar\'] = is_admin_bar_showing() ? 32 : 0;
        $global_variables[\'eltdElementAppearAmount\'] = search_and_go_elated_options()->getOptionValue(\'element_appear_amount\') !== \'\' ? search_and_go_elated_options()->getOptionValue(\'element_appear_amount\') : $element_appear_amount;
        $global_variables[\'eltdFinishedMessage\'] = esc_html__(\'No more posts\', \'search-and-go\');
        $global_variables[\'eltdMessage\'] = esc_html__(\'Loading new posts...\', \'search-and-go\');

        $global_variables = apply_filters(\'search_and_go_elated_js_global_variables\', $global_variables);

        wp_localize_script(\'search_and_go_elated_modules\', \'eltdGlobalVars\', array(
            \'vars\' => $global_variables
        ));

    }

    add_action(\'wp_enqueue_scripts\', \'search_and_go_elated_get_global_variables\');
}

if(!function_exists(\'search_and_go_elated_per_page_js_variables\')) {
    /**
     * Outputs global JS variable that holds page settings
     */
    function search_and_go_elated_per_page_js_variables() {
        $per_page_js_vars = apply_filters(\'search_and_go_elated_per_page_js_vars\', array());

        wp_localize_script(\'search_and_go_elated_modules\', \'eltdPerPageVars\', array(
            \'vars\' => $per_page_js_vars
        ));
    }

    add_action(\'wp_enqueue_scripts\', \'search_and_go_elated_per_page_js_variables\');
}

ADDED (1-7-2016):

Several searches for the definition of eltd.modules.listings on line 4 but found nothing. First 10 lines of listings.js:

(function ($) {
    \'use strict\';
    var listings = {};
    eltd.modules.listings = listings;

    listings.eltdOnDocumentReady = eltdOnDocumentReady;
    listings.eltdOnWindowLoad = eltdOnWindowLoad;
    listings.eltdOnWindowResize = eltdOnWindowResize;
1 个回复
最合适的回答,由SO网友:Pim Heijden 整理而成

我以正确的方式将子脚本排入队列,并使第一个引用错误(eltdGlobalVars)消失,如下所示:

在函数中。php在child I中删除了将脚本“search\\u and\\u go\\u elated\\u list”出列的行。然后,我使用与父级中的可插入函数同名的函数副本将其排队:“search\\u and\\u go\\u elated\\u listing\\u assets”。在这个副本中,我将脚本的位置修改为childtheme中的位置,并确保识别句柄,在其中添加了“child\\u0”。

看起来是这样的:

function search_and_go_elated_listing_assets() {

    wp_enqueue_style( \'search_and_go_elated_listings\', ELATED_ASSETS_ROOT.\'/css/listings.css\' );
    wp_enqueue_script( \'child_search_and_go_elated_listings\', get_stylesheet_directory_uri() . \'/assets/js/listings.js\', array(\'jquery\', \'underscore\', \'jquery-ui-autocomplete\'), false, true );

    if(search_and_go_elated_is_responsive_on()) {
        wp_enqueue_style( \'search_and_go_elated_listings_responsive\', ELATED_ASSETS_ROOT.\'/css/listings-responsive.min.css\' );
    }
}
add_action( \'wp_enqueue_scripts\', \'search_and_go_elated_listing_assets\' );
然后,我还复制了提到“search\\u and\\u go\\u elated\\u lising”的脚本片段,将其句柄更改为“child\\u search\\u and\\u go\\u elated\\u lising”。在下面的示例中,结合变量GlobalVars,menioned在原始错误中:

function search_and_go_elated_get_global_variables() {

    $global_variables = array();
    $element_appear_amount = -150;

    $global_variables[\'eltdAddForAdminBar\'] = is_admin_bar_showing() ? 32 : 0;
    $global_variables[\'eltdElementAppearAmount\'] = search_and_go_elated_options()->getOptionValue(\'element_appear_amount\') !== \'\' ? search_and_go_elated_options()->getOptionValue(\'element_appear_amount\') : $element_appear_amount;
    $global_variables[\'eltdFinishedMessage\'] = esc_html__(\'No more posts\', \'search-and-go\');
    $global_variables[\'eltdMessage\'] = esc_html__(\'Loading new posts...\', \'search-and-go\');

    $global_variables = apply_filters(\'search_and_go_elated_js_global_variables\', $global_variables);

    wp_localize_script(\'child_search_and_go_elated_modules\', \'eltdGlobalVars\', array(
        \'vars\' => $global_variables
    ));

}

add_action(\'wp_enqueue_scripts\', \'search_and_go_elated_get_global_variables\');
第二个引用错误(eltd)是通过正确地排列添加脚本的操作的优先级来解决的。现在我明白了这一点:确保在引用变量之前定义了它们!

因为我在函数中加入了几个脚本。子系统中的php另一个可能已相对于父系统进行了更改。所以为了解决列表中的引用错误。js我确保它比其他脚本(具体来说比modules.js更晚)排队。