Mobile Safari - touch event.target event

Question

I would like to have a goal when touching something on the screen of my iPad. But, unfortunately, it always returns currentTarget, not the target.

document.addEventListener('touchstart', onDocumentTouchStart, false); function onDocumentTouchStart(event) { if (event.target.tagName.toLowerCase() == "div" || event.target.tagName.toLowerCase() == "canvas") { // do someting } else { // do something else } } 

But event.target.tagName always "HTML" . But never touched a real element, for example, an anchor tag or div.

How to get the real item that I touched?

Thank you very much.

Vincent

Answer 1

You can try the "event.touches" array, which will contain one entry for each finger currently down, with the "target" value referring to the DOM element affected.

 function onDocumentTouchStart(event) { if (event.touches[0] && event.touches[0].target.tagName.toLowerCase() == "div") { // do someting } } 

However, I must note that I was not able to duplicate the original problem; when I tried this, event.target referred to the affected div as intended. You can also check your CSS and / or JS plugins, which may interfere with the event bubble.