WordPress and Jquery

  • raul99t

    (@raul99t)


    6 years, 8 months ago

    Hi,

    I’m having trouble with my script, as i search on google, it seems that my code didn’t work due to jquery on wordpress.

    $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {

        var href = $(e.target).attr('href');
        var $curr = $(".process-model  a[href='" + href + "']").parent();

        $('.process-model li').removeClass();

        $curr.addClass("active");
        $curr.prevAll().addClass("visited");
    });

    This is what supposed to looks like:
    https://codepen.io/rt99/pen/BaBWwRG

    is there any solutions?

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Moderator Steven Stern (sterndata)

    (@sterndata)

    Volunteer Forum Moderator

    6 years, 8 months ago

    The version of JQuery that ships with WordPress uses “no-conflict” mode. So, in your code, $ isn’t the shortcut for jQuery. You need to open with jQuery('a[data-toggle="tab"]...

    https://digwp.com/2011/09/using-instead-of-jquery-in-wordpress/

    Joy

    (@joyously)

    6 years, 8 months ago

    WordPress loads jQuery in no-conflict mode, which means that the $ is not defined.
    So not only do you need to load jQuery in you page when it is needed, you need to pass it into your function as $ or code your function using jQuery instead.

    Thread Starter raul99t

    (@raul99t)

    6 years, 8 months ago

    sorry for late reply. I’ve changed $ to jQuery, and nothing changed.

    jQuery('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {

        var href = jQuery(e.target).attr('href');
        var $curr = jQuery(".process-model  a[href='" + href + "']").parent();

        jQuery('.process-model li').removeClass();

        $curr.addClass("active");
        $curr.prevAll().addClass("visited");
    });

    I’m quite new to this, might need some explanation.

    Joy

    (@joyously)

    6 years, 8 months ago

    We are only seeing a little bit of the whole picture here.
    Remember that you need to load your script into the page and you need to either load jQuery or specify jQuery as a dependency on the wp_enqueue_script call you use to load it.

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘WordPress and Jquery’ is closed to new replies.