backbone.js在同一个函数上触发一​​个触摸/鼠标事件

时间:2012-06-26 05:32:19

标签: mobile backbone.js

我有一个Backbone View,包含移动和桌面版的活动:

events: {
  "touchstart .button": "action1",
  "mousedown  .button": "action1",
  "touchend   .button": "action2",
  "mouseup    .button": "action2",
}

我只想从我的移动设备触摸时触发一个事件。目前在我的一个移动设备中,action1被触发两次。

我尝试使用this solution中的自定义方法,但是在Android 2.3中,touchstart之后的touchend自定义方法不会被触发,但是使用纯粹的“touchend”会被触发。

因此,我正在考虑如果“touchend”被解雇,Backbone.js是否可以阻止“mouseup”被触发。

3 个答案:

答案 0 :(得分:4)

另一种方法,对我来说感觉不那么苛刻:

我喜欢在初始化应用程序时测试触摸事件并设置全局变量。

MyApp.clickEvent = ('ontouchstart' in window) ? "touchstart" : "mousedown";

然后在我看来,我执行的操作如下:

events: function() {
    var _events = {};
    _events[MyApp.clickEvent + " .button"] = "action1";

    return _events;
}

答案 1 :(得分:2)

一个hacky解决方案是使用underscore.js函数throttle来实现它,这样每x毫秒只能调用一次函数。查看文档here,看看它是否符合您的需求。

最终的解决方案是:

action1: _.throttle(function(params) {
    // Do what you do here
}, 400); // The timeframe within which the function can be called just once.

答案 2 :(得分:0)

您可以定义一个功能来确定触摸设备,如:

function is_touch_device() {  
  try {  
    document.createEvent("TouchEvent");  
    return true;  
  } catch (e) {  
    return false;  
  }  
} 

然后在事件中使用它:

events: function() {
    if(is_touch_device) {
       return {
          /// touch events
       }

    } else {
      return {
        /// mouse events
      }


}
}

如果它们完全相同dehrg答案将是一个不那么多余的