web-dev-qa-db-fra.com

jQuery n'est pas défini dans Wordpress, mais mon script est correctement mis en file d'attente

J'essaie de charger un fichier javascript mobile-menu.js distinct sur mon thème Wordpress. Lorsque je regarde la console, il est dit "jQuery n'est pas défini". Cependant, je sais que J'ai mis correctement mes fichiers de script en file d'attente. Des idées?

Fichier HTML:

<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-->

fichier functions.php:

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' );

fichier mobile-menu.js:

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

Ajoutez wp_enqueue_script('jquery'); avant de mettre vos scripts en file d'attente.

27
Gavin Simpson

Assurez-vous d'abord que le fichier jquery est inclus dans l'en-tête et que votre fichier est requis jQuery

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

Ensuite, vous devez démarrer votre fichier javascript comme:

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

OR

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

Tu peux essayer:

enquêter d'abord sur Jquery.

wp_enqueue_script('jquery');

puis mettre le dernier script en file d'attente avec dépendance JQuery dans le troisième argument, c'est-à-dire array('jquery') c'est ce que la plupart des gens oublient.

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

L'erreur jQuery is not defined Peut également apparaître avec du code jQuery incorporé dans les parties de votre modèle.

Cela se produit lorsque jQuery est ajouté au pied de page de la page, tandis que le script incorporé essaie de s'exécuter dans le milie de la page.

Si tel est le cas, vous devez charger jQuery dans l'en-tête avec wp_enqueue_script(). Le dernier paramètre doit donc être faux ici:

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

Maintenant, le code s'exécute dans le bon ordre et jQuery sera défini.

Une autre solution serait de déplacer le script incorporé dans un fichier Javascript qui sera également ajouté avec wp_enqueue_script() au pied de page. C'est à toi de décider.

0
Floris

Wordpress est livré avec jQuery par défaut

// 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');

        }
0
Ruso