Does jQuery update (1.7) interrupt events on touch event?

Question

This jsfiddle reproduces the problem and allows you to quickly switch between 1.6.4 and 1.7.1 .

You will see that LIs cease to be detected, since the coordinates are undefined after switching to 1.7.1

http://jsfiddle.net/eHHgP/2/

How can I fix this problem without downgrading?

 body{ font-family: sans-serif; } #other{ position: absolute; height: 300px; width: 300px; background: rgba(0,0,0,0.5); } #other ul{ position: absolute; top: 50px; right: 50px; bottom: 50px; left: 50px; width: 200px; height: 200px; } #other li{ display: block; margin: 25px; height: 50px; width: 50px; color: white; background: rgba(0,0,0,0.5); float: left; <div id="other"> <ul> <li>LI</li> <li>LI</li> <li>LI</li> <li>LI</li> </ul> </div> <div id="output"> output <div> $(document).bind('touchmove', function(event){ event.preventDefault(); }); $('#other').bind('touchstart touchmove', function(event){ element = document.elementFromPoint(event.pageX, event.pageY); console.log(event); if(element.nodeName === 'LI'){ $('#output').html('LI'); }else{ $('#output').html('NOT LI'); } }); 

Answer 1

It turns out that in 1.7 only the events that pass this regexp have certain “mouse properties” (for example, .pageX ) passed to the jQuery event object:

 /^(?:mouse|contextmenu)|click/ 

Obviously touchstart , etc. do not pass this regular expression. Therefore, you will have to mark these events as mouse events yourself, as jQuery does here . You can do it this way if you want to go for brevity:

 // add more if necessary, I don't know much about touch events $.each("touchstart touchmove touchend".split(" "), function(i, name) { jQuery.event.fixHooks[name] = jQuery.event.mouseHooks; }); 

Answer 2

Another way to handle this is to use the correct e.changedTouches. Therefore, it will work as follows:

 if (typeof e.changedTouches !== 'undefined') { pageX = e.changedTouches[0].pageX; pageY = e.changedTouches[0].pageY; } else { pageX = e.pageX; pageY = e.pageY; } 

Hope this helps.