Как поставить в очередь один скрипт за другим в WordPress `functions.php` и заставить их работать вместе? - PullRequest
0 голосов
/ 26 января 2019

У меня есть 2 .js файлы, первый - plugins.js, второй - ui.js, и оба они отображаются в «отладке» инспектора, поэтому оба они включены.

У меня есть функция jquery в plugins.js, которую нужно вызвать в ui.js, поэтому сначала я ставлю в очередь plugins.js, а сразу за ней ставлю ui.js.

Однако консоль ввеб-браузер сообщает мне, что функция не определена, и она не работает.

Она работает, если я вырезал и вставил функцию из plugins.js в ui.js.Это сработало, когда я попробовал это в JSfiddle тоже.

functions.php

function add_scripts() { 

wp_enqueue_script( 'plugins', get_template_directory_uri() . '/javascript/plugins.js', array( 'jquery', 'jquery-ui-core' )           , '1.0.0', true );
wp_enqueue_script( 'ui'     , get_template_directory_uri() . '/javascript/ui.js'     , array(), '1.0.0', true );
}
add_action('wp_enqueue_scripts', 'add_scripts');

plugins.js:

jQuery(document).ready(function($) {
    function PNGPreloader(e,t,i,r,n,a){...}
});

ui.js:

jQuery(document).ready(function($) {
    $(...).each(function(){
        mobileIcons[ID] = new PNGPreloader($object,frames,size[0],size[1],20,false);
    });

Работает, если поставитьфункция от plugins.js in ui.js,:

jQuery(document).ready(function($) {
    function PNGPreloader(e,t,i,r,n,a){...}
    $(...).each(function(){
        ... = new PNGPreloader(...);
});

Ответы [ 2 ]

0 голосов
/ 26 января 2019

Предполагалось добавить jquery-ui-widget к параметру зависимостей wp_enqueue_script.

function stripesinteriors_theme_resources() { 
    wp_enqueue_script( 'plugins', get_template_directory_uri() . '/javascript/plugins.js', array( 'jquery', 'jquery-ui-core', 'jquery-ui-widget' ), '1.0.0', true );
    wp_enqueue_script( 'ui'     , get_template_directory_uri() . '/javascript/ui.js'     , array()                                                , '1.0.0', true );
}
0 голосов
/ 26 января 2019

Можете ли вы переместить function PNGPreloader(e,t,i,r,n,a){...} за пределы блока jQuery(document).ready(function($) { ... });?

Это ограниченная проблема, так как код в ui.js не видит ничего внутри функции, которая вызывается для готового документа в plugins.js.

Или вы можете сделать что-то вроде:

plugins.js:

var fnPNGPreloader;  // globally accessible

jQuery(document).ready(function($) {
    fnPNGPreloader = function (e,t,i,r,n,a) {
        /*.. assuming you do stuff with "$" in here ..*/
    };
    //...
});

ui.js:

jQuery(document).ready(function($) {
    $(...).each(function(){
        mobileIcons[ID] = new fnPNGPreloader($object,frames,size[0],size[1],20,false);
    });
});
...