Some jQuery functionality loading, but .click function not working

  • Resolved quomo

    (@quomo)


    13 years ago

    I am working with a custom themed wordpress site that only uses static pages for content management (no posts).

    I am trying to clean up some of the pages so that the content is presented with jQuery tabs instead of link after link after link going down the page.

    I currently have the tabbed content showing (with only the first tab showing, so it looks like the jQuery .hide()function is working. But when I click on the tabs, the content doesn’t change (though it does work outside of wordpress). (example: https://datadrivendetroit.org/toolbox/).

    I am using the code I found here: https://justintadlock.com/archives/2007/11/07/how-to-create-tabs-using-jquery

    header.php looks like this (yes, it’s a bit of a mess):

    [Code moderated as per the Forum Rules. Please use the pastebin]

    I am not seeing any relevant errors in Firebug and am confused why it seems to be all loaded and should be working, though only goes half the way.

    any help would be greatly appreciated.

Viewing 3 replies - 1 through 3 (of 3 total)
  • Thread Starter quomo

    (@quomo)

    Sorry, here are pastebin links to the:
    header.php file – https://pastebin.com/gwwEBVyj
    tabs.js file (which is connected at line 51 of header.php, jQuery was undefined if it were placed anywhere above <?php wp_head(); ?> on line 49 of header.php ) – https://pastebin.com/PLCsdS7Y

    example link was malformed by extra parenthesis: https://datadrivendetroit.org/toolbox

    You should really load your scripts properly by attaching them to the wp_enqueue_scripts action

    Also, your jQuery is already run in no-conflict when you do this…

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

    everything in that function is now safe to use the $ selector instead of jQuery

    review this page and see if your problem persists.
    https://codex.www.ads-software.com/Function_Reference/wp_enqueue_script

    BTW, what does your JS console say the errors are?

    Thread Starter quomo

    (@quomo)

    Yes, you were right. I wasn’t getting any JS error when clicking on the tabs before, yet it still didn’t work.

    When I used wp_enqueue_scripts instead (and put tabs.js above <?php wp_head(); ?), I started seeing the error that my $ was not defined, so I removed the no-conflict, used the $ selector and now it works.

    well done. marking this as resolved.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Some jQuery functionality loading, but .click function not working’ is closed to new replies.