jQuery ist in WordPress nicht definiert, aber mein Skript wird ordnungsgemäß in die Warteschlange gestellt

Ich versuche, eine separate Javascript-Datei mobile-menu.js in mein WordPress-Design zu laden. Wenn ich auf die Konsole schaue, sagt sie: “jQuery ist nicht definiert.” Ich weiß jedoch, dass ich meine Skriptdateien korrekt in die Warteschlange gestellt habe. Irgendwelche Ideen?

HTML-Datei:

<a href="#" id="menu-icon"></a> <!--this line wasn't here originally-->
    <div id="switchmenu"><!--switchmenu begin-->
        <?php wp_nav_menu( array( 'theme_location' => 'primary' ) ); ?>
    </div><!--switchmenu end-->

functions.php-Datei:

function lapetitefrog_scripts() {
    wp_enqueue_style( 'lapetitefrog-style', get_stylesheet_uri() );
    wp_enqueue_script( 'lapetitefrog-mobile-menu', get_template_directory_uri() . '/js/mobile-menu.js', array(), '1.0', true );
}
add_action( 'wp_enqueue_scripts', 'lapetitefrog_scripts' );

mobile-menu.js-Datei:

 jQuery(document).ready(function($) {
    $('#menu-icon').click(function() {
            $('#switchmenu').slideToggle("fast");
    });
});

Addieren wp_enqueue_script('jquery'); bevor Sie Ihre Skripte einreihen.

Stellen Sie zunächst sicher, dass die jquery-Datei im Header enthalten ist und Ihre Datei jQuery erfordert

wp_enqueue_script( 
        'lapetitefrog-mobile-menu', 
        get_template_directory_uri() . '/js/mobile-menu.js', 
        array('jquery'), 
        '1.0', 
        true 
);

Zweitens sollten Sie Ihre Javascript-Datei wie folgt starten:

(function($) {
    $(document).ready(function() {
        .......
    });
})(jQuery);

ODER

// Use jQuery in place of $
jQuery(document).ready(function() {
    .....
});

Du kannst es versuchen:

Stellen Sie zuerst Jquery in die Warteschlange.

wp_enqueue_script('jquery'); 

und dann das letztere Skript mit einreihen JQuery-Abhängigkeit im 3. Argument dh array('jquery') das vergessen die meisten.

wp_enqueue_script( 'lapetitefrog-mobile-menu', get_template_directory_uri() . '/js/mobile-menu.js', array('jquery'), '1.0', true );

WordPress wird standardmäßig mit jQuery ausgeliefert

// Adds jQuery
    add_action('init', 'childoftwentyeleven_down');

        function childoftwentyeleven_down() {

          // register your script location, dependencies and version
                wp_register_script('down',
                    get_stylesheet_directory_uri() . '/js/down.js',
                    array('jquery') );
           // enqueue the script
           wp_enqueue_script('down');

        }

Der Fehler jQuery is not defined kann auch mit jQuery-Code erscheinen, der in Ihre Vorlagenteile eingebettet ist.

Dies geschieht, wenn jQuery zur hinzugefügt wird Fusszeile der Seite, während das eingebettete Skript versucht, in der auszuführen Mitte der Seite.

Wenn dies der Fall ist, müssen Sie jQuery im Header mit laden wp_enqueue_script(). Der letzte Parameter muss also sein falsch Hier:

wp_enqueue_script( 'my-jquery', get_template_directory_uri() . '/js/jquery.js', array(), time(), false );

Jetzt wird der Code in der richtigen Reihenfolge ausgeführt und jQuery wird definiert.

Eine andere Lösung wäre, das eingebettete Skript in eine Javascript-Datei zu verschieben, die ebenfalls hinzugefügt wird wp_enqueue_script() zur Fußzeile der Seite. Es liegt an dir.