Question

Here’s a live demo page

… and the relevant code:

$('#button').on('touchstart', 'a', function(e) {
    
    e.preventDefault();
    
});

When using my iPhone4 and Safari 5.1.1, sometimes when touching the black button (on my demo page), I’ll get a hash tag in the URL (i.e. http://foo.com/#). It does not happen all the time, only occasionally… It appears to happen when touching slower on the outside edge of the button.

I’m stumped!

Any idea what’s going on here? Tips on how to make sure the link never fires?

---

EDIT #1:

I don’t want the hash tag to ever appear in the URL. (sorry if this was not clear).*

---

EDIT #2:

For future readers: After asking my question, I found this question… It’s related to my issue and there’s a ton of useful suggestions.

Thanks to everyone who replied here… If it was not for you, I probably would not have discovered the above thread.

Also, here’s my latest demo page just in case anyone want’s to see the solution I chose for handling "ghost clicks".

Answer 1

You need to handle and cancel the click event too.