Skip to main content
edited tags
Link
Johansson
  • 15.4k
  • 11
  • 43
  • 79
added 620 characters in body
Source Link

I'm trying to add a class to an element within the main menu, but nothing is happening. I'm using Underscores starter theme, which has this in the header.php:

<?php
    wp_nav_menu( array(
        'theme_location' => 'menu-1',
        'menu_id'        => 'primary-menu',
        'after'          => '<span class="fa fa-times"></span>',
    ) );
?>

I then put this in the navigation.js file (also tried inline in the footer.php):

$(".menu-item-has-children .span").click(function() {
    $(".menu-item-has-children .sub-menu").removeClass("toggled");
    $(this).next(".sub-menu").toggleClass("toggled");
});

But nothing happens. I've also tried a simple:

$('body').click(function() {
    alert("Yeah!");
});

And nothing happens there either. This does work:

window.onload = function() {
    alert("Yeah!");
}

jQuery is loading:

<script type='text/javascript' src='http://example.com/wp-includes/js/jquery/jquery.js?ver=1.12.4'></script>

navigation.js is enqueued in functions.php:

function themename_scripts() {

wp_enqueue_style( 'themename-style', get_stylesheet_uri() );

wp_enqueue_script( 'themename-navigation', get_template_directory_uri() . '/js/navigation.js', array(), '20151215', true );

wp_enqueue_script( 'themename-skip-link-focus-fix', get_template_directory_uri() . '/js/skip-link-focus-fix.js', array(), '20151215', true );

if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
    wp_enqueue_script( 'comment-reply' );
}
}
add_action( 'wp_enqueue_scripts', 'themename_scripts' );

...So what basic error have I made?

I'm trying to add a class to an element within the main menu, but nothing is happening. I'm using Underscores starter theme, which has this in the header.php:

<?php
    wp_nav_menu( array(
        'theme_location' => 'menu-1',
        'menu_id'        => 'primary-menu',
        'after'          => '<span class="fa fa-times"></span>',
    ) );
?>

I then put this in the navigation.js file (also tried inline in the footer.php):

$(".menu-item-has-children .span").click(function() {
    $(".menu-item-has-children .sub-menu").removeClass("toggled");
    $(this).next(".sub-menu").toggleClass("toggled");
});

But nothing happens. I've also tried a simple:

$('body').click(function() {
    alert("Yeah!");
});

And nothing happens there either. This does work:

window.onload = function() {
    alert("Yeah!");
}

jQuery is loading:

<script type='text/javascript' src='http://example.com/wp-includes/js/jquery/jquery.js?ver=1.12.4'></script>

...So what basic error have I made?

I'm trying to add a class to an element within the main menu, but nothing is happening. I'm using Underscores starter theme, which has this in the header.php:

<?php
    wp_nav_menu( array(
        'theme_location' => 'menu-1',
        'menu_id'        => 'primary-menu',
        'after'          => '<span class="fa fa-times"></span>',
    ) );
?>

I then put this in the navigation.js file (also tried inline in the footer.php):

$(".menu-item-has-children .span").click(function() {
    $(".menu-item-has-children .sub-menu").removeClass("toggled");
    $(this).next(".sub-menu").toggleClass("toggled");
});

But nothing happens. I've also tried a simple:

$('body').click(function() {
    alert("Yeah!");
});

And nothing happens there either. This does work:

window.onload = function() {
    alert("Yeah!");
}

jQuery is loading:

<script type='text/javascript' src='http://example.com/wp-includes/js/jquery/jquery.js?ver=1.12.4'></script>

navigation.js is enqueued in functions.php:

function themename_scripts() {

wp_enqueue_style( 'themename-style', get_stylesheet_uri() );

wp_enqueue_script( 'themename-navigation', get_template_directory_uri() . '/js/navigation.js', array(), '20151215', true );

wp_enqueue_script( 'themename-skip-link-focus-fix', get_template_directory_uri() . '/js/skip-link-focus-fix.js', array(), '20151215', true );

if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
    wp_enqueue_script( 'comment-reply' );
}
}
add_action( 'wp_enqueue_scripts', 'themename_scripts' );

...So what basic error have I made?

Source Link

jQuery on Underscores menu

I'm trying to add a class to an element within the main menu, but nothing is happening. I'm using Underscores starter theme, which has this in the header.php:

<?php
    wp_nav_menu( array(
        'theme_location' => 'menu-1',
        'menu_id'        => 'primary-menu',
        'after'          => '<span class="fa fa-times"></span>',
    ) );
?>

I then put this in the navigation.js file (also tried inline in the footer.php):

$(".menu-item-has-children .span").click(function() {
    $(".menu-item-has-children .sub-menu").removeClass("toggled");
    $(this).next(".sub-menu").toggleClass("toggled");
});

But nothing happens. I've also tried a simple:

$('body').click(function() {
    alert("Yeah!");
});

And nothing happens there either. This does work:

window.onload = function() {
    alert("Yeah!");
}

jQuery is loading:

<script type='text/javascript' src='http://example.com/wp-includes/js/jquery/jquery.js?ver=1.12.4'></script>

...So what basic error have I made?