javascript Backbone.js 单击事件不适用于触摸
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/7828054/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Backbone.js click event doesn't work with touch
提问by fancy
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?
在 Mobile Safari 上使用此事件时,事件会在触摸时触发两次。这是一个已知的错误还是我自己造成的?
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.
感谢您提供任何信息。
回答by dira
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/
看到它在行动:http: //jsfiddle.net/dira/Ke2px/2/
回答by Dinoop mathew
I have used Modernizr to detect the touch device and used following code and this worked for me.
我使用 Modernizr 来检测触摸设备并使用以下代码,这对我有用。
events :function(){
return Modernizr.touch ?
{
"touchstart #edit" : "openEdit",
}:
{
"click #edit" : "openEdit",
}
}
回答by Nervetattoo
I've solved the same issue generically by creating backbone.touch for Backbonethat will monkey patch Backbone.View to respond to touch events when a touch device is used, or regular click events when not.
我通过为 Backbone创建Backbone解决了同样的问题,它会在使用触摸设备时修补 Backbone.View 以响应触摸事件,或者在不使用时响应常规点击事件。
You can either just include the source file to have it transform all of your click
events in Backbone.Views, or you can take a peek at the code and implement it yourself.
您可以只包含源文件,让它click
在 Backbone.Views 中转换您的所有事件,或者您可以查看代码并自己实现它。
回答by araghorn
I defined both events types and it works for me on a mobile and desktop:
我定义了两种事件类型,它适用于移动设备和桌面设备:
events: {
'click' : 'select',
'touchstart' : 'select'
}
回答by Kai
I'm not familiar with Backbone, but maybe try setting it conditionally?
我不熟悉 Backbone,但也许可以尝试有条件地设置它?
if ('ontouchstart' in document.documentElement) {
// 'touchstart': 'select'
} else {
// 'click': 'select'
}
回答by ReduxDJ
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?
使用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 reads better for these type of list comprehensions imho.
恕我直言,对于这些类型的列表理解,Coffeescript 读起来更好。
回答by nosh247
this worked for me.
这对我有用。
events:{
'click #edit':'select',
'touchstart #edit':'select'
},
select: function(e){
e.stopPropagation();
e.preventDefault();
console.log('open upload dialog ', e.type);
}
now when you test this if the device is touch e.type should be touchstart and only fire once. Same for click on no-touch device. In case anybody is still looking for a simple solution for this.
现在当你测试这个设备是否是触摸 e.type 应该是 touchstart 并且只触发一次。单击非触摸设备也是如此。如果有人仍在为此寻找简单的解决方案。
回答by dombesz
I just include the jquery touchpunch library and that's it.
我只包含 jquery touchpunch 库,仅此而已。