Transformer Tabs: jQuery error

[ramasaig]

I know it’s a long time since Chris wrote the ‘Transformer Tabs’ article, but I’ve only been following it up today.

The HTML displays OK, and the supporting CSS and JS are loading. I’m getting no action on the tabs, but I’m seeing an error on the Inspector Console:
Error: Syntax error, unrecognized expression: [href=#tab-2] jquery-3.4.0.js:1563:8, which expands to:
jQuery 7
error
tokenize
select
Sizzle
find
init
jQuery
changeTab http://testgen/js/test_tabs.js:28

As far as I can see I’ve pasted the code correctly. The offending line seems to be: var anchor = $(“[href=” + hash + “]”);
OR possibly the value of ‘hash’

I’m using jQuery 3.4.0 Could that be what’s causing the problem.
pageLoadCorrectTab http://testgen/js/test_tabs.js:48
init http://testgen/js/test_tabs.js:8
http://testgen/js/test_tabs.js:57

I’m still looking for the solution, but I’d really appreciate some help, please.

Tim Dawson

[ramasaig]

OK, I’ve figured it out.

The given code in ‘changeTab (second line) reads: var anchor = $(“[href=” + hash + “]”);

and it should be: var anchor = $(“[href='” + hash + “‘]”);
note addition of single quotes around the variable hash, so it now evaluates as href=’hashvalue’

I can’t explain why the Code Pen works!

Tim Dawson

[Author]

Posts