Trailing hash (#) in URL breaks some Javascript

Question

I'm having a strange issue which happens whenever a page is loaded with a hash at the end, ex. #home or #quotes. Some javascript breaks when there is a hash at the end of the link. The page works fine when there is no hash.

Live examples:

http://real-ufos.com/ - works

http:// real-ufos.com/#home - quite a few javascript things broken (earth's positioning, smooth scroll to hash section, comment tabs, opening prettyphoto lightbox etc)

Here is the scripts file: http:// real-ufos.com/wp-content/themes/real-ufos/js/scripts.js which I guess is most likely to contain the issue.

(Had to break up the links as I can't post more than one)

This is a similar question to Trailing hash (#) in URL breaks some Javascript? - but I couldn't find my answer there.

Have you looked for errors in your browser console? Uncaught Error: Syntax error, unrecognized expression: a[href=#home] — Stephen P
– Stephen P, Commented Jun 2, 2017 at 18:34
Try putting quotes around the href value: window.location.hash ? 'a[href="' + window.location.hash + '"]' at line 46 in your scripts.js?ver=4.7.5 so instead of a[href=#home] it comes out as a[href="#home"] — Stephen P
– Stephen P, Commented Jun 2, 2017 at 18:40

Stephen P · Accepted Answer · 2017-06-02 20:11:18Z

0

When going to your page real-ufos.com/#home the browser console shows an error
Uncaught Error: Syntax error, unrecognized expression: a[href=#home]

A CSS or xpath selector of this form should have quotes around the value of the attribute: tag[attribute="value"]

You can change your scripts.js file to put in the quotes

window.location.hash ? 'a[href=' + window.location.hash + ']'
// becomes
window.location.hash ? 'a[href="' + window.location.hash + '"]'
//                             ^                            ^

This should make the syntax proper and correct the error.

edited Jun 2, 2017 at 20:11

answered Jun 2, 2017 at 18:59

Stephen P

14.9k2 gold badges50 silver badges71 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Trailing hash (#) in URL breaks some Javascript

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related