Backbone.js click event doesn't work with touc

Question

events: 
    'click' : 'select'

When using this event on Mobile Safari the event gets triggered twice when touched. Is this a known bug or something that I am causing on my own?

I've since changed it to

events: 
    'touchstart' : 'select'

and it works great but means that it will not work in normal browsers anymore.

Thanks for any info.

Answer 1

Using coffeescript, I'd do the following, I don't ever find a reason to bring in modernizer when every mobile device these days is really a touch device, I mean when was the last time you had to really support something that didn't?

window.isTouchDevice =  (/android|webos|iphone|ipod|ipad|blackberry|iemobile/i.test(navigator.userAgent.toLowerCase()) )

  events: ->
    for k, v of this when /click/.test(k) and isTouchDevice
      mobileKey = k.replace('click','touchstart')
      events[ mobileKey ] = v
      delete events[ k ]
    return events

Coffeescript reads better for these type of list comprehensions imho.

Answer 2

Try this code:

TouchView = Backbone.View.extend({
  events: function() {
    return MOBILE ? 
       {
         "touchstart": 'select'
       } : 
       {
         "mousedown": 'select'
       }
  }
}

See it in action: http://jsfiddle.net/dira/Ke2px/2/