jQuery live() removing iPhone touch event attributes?

Question

I am binding live events on links in my PhoneGap app. The event does fire successfully (confirmed by alert()ing), but it seems any touch data is not attached to the event object like it should be. This happens on all touch events - touchstart, touchmove, and touchend.

$('a').live('touchend', function(event) {
  event.preventDefault();
  alert(event.touches.length); // event.touches should be populated!
});

Any ideas? Am I SOL with jQuery.live()?

Answer 1

Actually, you can use the .live method. You don't have the event.touches property because of how jQuery handles events internally. In order to "fix" events, jQuery clones the event. In doing so, it only copies over a limited number of properties for performance reasons. However, you can still access the original event object via the event.originalEvent property.

So your example code would need to look like the following:

$('a').live('touchend', function(event) {
  event.preventDefault();
  console.log(event.originalEvent.touches.length);
});

Here are the properties that are copied over: http://github.com/jquery/jquery/blob/master/src/event.js#L411