2011-10-19 111 views
9
events: 
    'click' : 'select' 

在移動Safari上使用此事件時,觸摸時觸發事件兩次。這是一個已知的錯誤還是我自己造成的?Backbone.js點擊事件不支持觸摸

因爲我已經把它改爲

events: 
    'touchstart' : 'select' 

,它的偉大工程,但同時也意味着它不會在瀏覽器中正常工作了。

感謝您的任何信息。

回答

1

我不熟悉骨幹,但也許嘗試設置它的條件?

if ('ontouchstart' in document.documentElement) { 
    // 'touchstart': 'select' 
} else { 
    // 'click': 'select' 
} 
16

試試這個代碼:

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

看到它在行動:http://jsfiddle.net/dira/Ke2px/2/

+0

沒有爲我工作(在控制檯中沒有看到任何輸出)。骨幹事件系統正在工作,因爲當我將它改爲「click #main」時觸發事件。 – Nippysaurus

+0

@Nippysaurus你將需要有自己的代碼來檢測'MOBILE'。 –

3

我已經使用Modernizr的檢測觸摸設備和使用下面的代碼,這爲我工作。

events :function(){ 
    return Modernizr.touch ? 
    { 
     "touchstart #edit" : "openEdit", 
    }: 
    { 
     "click #edit" : "openEdit", 
    } 
} 
+0

工作完美! –

3

我一般通過創建backbone.touch for Backbone將在使用觸控設備猴補丁Backbone.View響應觸摸事件,或定期點擊事件時沒有解決同樣的問題。

您可以只包含源文件,讓它在Backbone.Views中轉換所有click事件,或者您可以查看代碼並自行實施。

2

我定義這兩個事件的類型和它的作品對我來說是移動和桌面上:

events: { 
'click' : 'select', 
'touchstart' : 'select' 
} 
+3

這將觸發「選擇」方法兩次,因爲當你點擊觸摸屏設備上它激發的所有事件:touchstart touchmove touchend 鼠標懸停鼠標移動 鼠標按下 鼠標鬆開 點擊 – SimplGy

0

使用CoffeeScript的,我會做以下,我從來沒有找到一個理由當現在的每個移動設備都是真正的觸摸設備時,要引進現代化設備,我的意思是什麼時候你最後一次需要真正支持那些沒有的東西?

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閱讀更好的這些類型的列表解析imho。

0

這對我有用。

events:{ 
    'click #edit':'select', 
    'touchstart #edit':'select' 
}, 
select: function(e){ 
    e.stopPropagation(); 
    e.preventDefault(); 
    console.log('open upload dialog ', e.type); 
} 

現在當你測試該設備是否觸摸e.type應該touchstart,只有火一次。 用於點擊非觸摸設備。 如果有人仍然在尋找一個簡單的解決方案。