Javascript 海关;“刷卡”;Mobile Safari中的事件未触发
我已经为jQuery编写了一个插件,它模拟移动事件,但也支持标准的web浏览器。以下是Javascript 海关;“刷卡”;Mobile Safari中的事件未触发,javascript,jquery,events,mobile,safari,Javascript,Jquery,Events,Mobile,Safari,我已经为jQuery编写了一个插件,它模拟移动事件,但也支持标准的web浏览器。以下是swipleft和swiperight事件的标记: (function($) { var settings = { swipe_h_threshold : 30, swipe_v_threshold : 50, taphold_threshold : 750, startevent : ('ontouchstart' in
swipleft
和swiperight
事件的标记:
(function($) {
var settings = {
swipe_h_threshold : 30,
swipe_v_threshold : 50,
taphold_threshold : 750,
startevent : ('ontouchstart' in document.documentElement) ? 'touchstart' : 'mousedown',
endevent : ('ontouchstart' in document.documentElement) ? 'touchend' : 'mouseup'
};
// swipeleft Event:
$.fn.swipeleft = function(handler) {
return this.each(function() {
$this = $(this);
var start_x = 0;
var end_x = 0;
$this.bind(settings.startevent, function(e) {
e.stopPropagation();
e.preventDefault();
start_x = e.pageX;
$this.one(settings.endevent, function(e) {
end_x = e.pageX;
if(start_x > end_x && (start_x - end_x >= settings.swipe_h_threshold))
{
handler.call(this);
}
});
});
});
};
// swiperight Event:
$.fn.swiperight = function(handler) {
return this.each(function() {
var $this = $(this);
var start_x = 0;
var end_x = 0;
$this.bind(settings.startevent, function(e) {
e.preventDefault();
e.stopPropagation();
start_x = e.pageX;
$this.one(settings.endevent, function(e) {
end_x = e.pageX;
if(start_x < end_x && (end_x - start_x >= settings.swipe_h_threshold))
{
handler.call(this);
}
});
});
});
};
}) (jQuery);
(函数($){
变量设置={
刷卡阈值:30,
滑动阈值:50,
TAPPHOLD_阈值:750,
startevent:('document.documentElement中的'ontouchstart')?'touchstart':'mousedown',
endevent:('document.documentElement中的'ontouchstart')?'touchend':'mouseup'
};
//swipeleft事件:
$.fn.swipleft=函数(处理程序){
返回此值。每个(函数(){
$this=$(this);
var start_x=0;
var end_x=0;
$this.bind(settings.starteEvent,函数(e){
e、 停止传播();
e、 预防默认值();
start_x=e.pageX;
$this.one(settings.endevent,函数(e){
end_x=e.pageX;
如果(开始\u x>结束\u x&&(开始\u x-结束\u x>=设置.滑动\u h\u阈值))
{
handler.call(this);
}
});
});
});
};
//swiperight事件:
$.fn.swiperight=函数(处理程序){
返回此值。每个(函数(){
var$this=$(this);
var start_x=0;
var end_x=0;
$this.bind(settings.starteEvent,函数(e){
e、 预防默认值();
e、 停止传播();
start_x=e.pageX;
$this.one(settings.endevent,函数(e){
end_x=e.pageX;
如果(开始\u x<结束\u x&&(结束\u x-开始\u x>=设置.滑动\u阈值))
{
handler.call(this);
}
});
});
});
};
})(jQuery);
然后我使用以下命令调用事件:
$('my#u div').swiperight(function(){self.nextCard('r');});
$('my#u div').swipleft(function(){self.nextCard('r');})
这似乎在桌面浏览器(不管怎样,Chrome)上运行良好,但在Mobile Safari中似乎不起作用。swipleft
执行时没有问题,但是swiperight
无论如何都不会运行
有人能提供任何指针吗?如果我没有完全弄错的话
e
(在事件回调中)在移动浏览器上有一个数组。每个触摸事件都有一个元素
这里有一个例子:
document.addEventListener('touchmove', function(event) {
event.preventDefault();
var touch = event.touches[0];
console.log("Touch x:" + touch.pageX + ", y:" + touch.pageY);
}, false);
但是为什么
swipeleft
可以毫无问题地工作呢?