title: Preventing mouse emulation events (i.e. click) from touch events in Mobile Safari / iPhone using Javascript
body: <p>In doing a single page Javascript app with interactive DOM elements I've found that the "<code>mouseover-mousemove-mousedown-mouseup-click</code>" sequence happens all in a bunch <strong>after</strong> the "<code>touchstart-touchmove-touchend</code>" sequence of events. </p>
  
  <p>I've also found that it is possible to prevent the "<code>mouse*-click</code>" events from happening by doing an "<code>event.preventDefault()</code>" during the <strong><code>touchstart</code></strong> event, but <em>only</em> then, and not during the <code>touchmove</code> and <code>touchend</code>. This is a strange design, because because it is not possible to know during the <code>touchstart</code> yet whether the user intents to drag or swipe or just tap/click on the item. </p>
  
  <p>I ended up setting up a "ignore_next_click" flag somewhere tied to a timestamp, but this is obviously not very clean.</p>
  
  <p>Does anybody know of a better way of doing this, or are we missing something?</p>
  
  <p>Note that while a "click" can be recognized as a "<code>touchstart-touchend</code>" sequence (ie no "<code>touchmove</code>"), there are certain things, such as keyboard input focus, that can only happen during a proper <code>click</code> event.</p>