如何将三个“触摸”浏览器事件与延迟相结合以模拟“长按”事件,并使其可用于jQuery以附加到任何适当的DOM元素?
由于我认为iPad和其他触摸屏设备最可靠只能触发touchstart,touchmove和touchend事件,我想需要一个复杂或另一个复杂程度的框架,以便对手势,长按等事件做出反应和多次接触。
我还没准备好在我当前的项目中添加一个移动框架,所以为此,我添加了一些代码,似乎在模拟“长”按下时效果很好,并且允许有人来,并触发预定义的处理程序或为此类事件添加额外的处理程序:
var touchTimeout = null;
var $element = null;
$('div#SomeIdOnADIVElementOrTwo')
.on('touchstart', function(){
$element = $(this);
//not sure if this is absolutely necessary, but it was based off an Internet resource found when it didn't work like I wanted it to - and it works, so...
touchTimeout = setTimeout(
function($element){
return function(){
$($element).trigger('longpress');
};
}($element), 1000
);
})
.on('touchend touchmove', function(){
clearTimeout(touchTimeout);
})
.on('longpress', function(){
$(this).dblclick();
});
但是,这当然仅限于我在第一行传递给原始jQuery全向函数调用的选择器或jQuery对象(在我的例子中,是一个id为SomeIdOnADIVElementOrTwo
的div)。我想做的是将三个事件'touchstart','touchmove'和'touchend'(连同延迟/超时等)定义为一个标准的“事件”,有人可以“处理”任何“可触摸” “DOM对象。
这就像将我的选择器更改为*
一样简单吗?我很确定这会在概念上有效,但我不禁认为在具有大量元素的页面上很难处理 - 或者我可能对事件处理程序的注册方式感到困惑?我是否可能更好地使用.longPress()
函数扩展jQuery(与.click()
和.dblClick()
函数一样)?这不可行或不可能吗?它是非常简单的,我错过了什么?