In my WordPress site, I’ve created a Modal shortcode, which opens a modal when the modal’s “name” is in the hash part of the location.
For instance /#contact-us will open my “contact us” modal.
To do this I have a hashchange event listener on the window, using jQuery, as so:
$(document).ready(function () {
$(window).on('hashchange', function () {
openModal();
});
});
On my laptop, this works pretty fine.
The problem is that when I try it on my mobile phone (Nexus 5 – Chrome & Firefox), and even when I use Chrome’s devtools emulator, when clicking on an anchor with a href="#contact-us", it won’t work – The hash in the url changes but the event handler is not being called.
The weird thing is if I manually add a hash to the url, the event handler will be called.
I thought there might be another handler that is stopping the propagation or something like that, so I tried using jQuery’s _data function (as mentioned here) to see if there are any handlers, but couldn’t find any.
So I guess my question is, why isn’t this working? and what else can I do to find out where the event is “getting lost”?
