jQuery works in console but not when in a file

Question

jQuery works in console but not when in a file

Stanley Tan

2022年5月12日 20:03

This is the code.

jQuery(document).ready(function() {
    jQuery( '#menu-item-927' ).on( 'ubermenuopen', function(){
      jQuery('.site-content').addClass('blur');
    });
});

It works when I use it in the console but does not work when in a JS file.

Here are the things I have tried:

Enqueued script with jQuery dependency wp_enqueue_script( 'script', get_stylesheet_directory_uri() . '/custom.js', array( 'jquery' ), '1.0.0', false ); and custom.js does show up in the source.
Added jQuery(document).ready(function().

P.S: ubermenuopen is an events API from the UberMenu plugin.

Topic jquery Wordpress

Category Web

Bhautik · Accepted Answer · 2021年11月13日 13:10

I tested and works fine. but you can use the wp_footer hook and you can add your custom js. check below code. code will go to the active theme functions.php file.

function add_custom_scripts(){ ?>
<script type="text/javascript">
    (function($){
        $(document).ready(function() {
            $( '#menu-item-927' ).on( 'ubermenuopen', function(){
              $('.site-content').addClass('blur');
            });
        });
    })(jQuery);
</script>
<?php }
add_action( 'wp_footer', 'add_custom_scripts', 10, 1 );

jQuery works in console but not when in a file

About