在 jQuery Mobile 中检测从边缘滑动

Question

我想在使用$("#panel").panel("open"); 打开面板之前检测用户是否从边缘滑动。这是代码

$("#main").on("swiperight",function(event){
var data = event.originalEvent.touches ? event.originalEvent.touches[0] : event,
    coords = [data.pageX, data.pageY];

console.log(coords);
});

但是coords 没有返回任何内容，因为我收到了错误：

未捕获的类型错误：无法读取未定义的属性 'touches'

1. 那么有没有办法在滑动发生时获取坐标？

2. 或者有没有一种简单的方法来检测凝视位置是否来自 而是左边缘？

谢谢。

Answer 1

在 jqm 1.4+ 中尝试以下，对我有用，相应地调整边缘修剪值，50 对我有好处

$( "div.ui-page" ).on( "swiperight", function( e ) {
    if ( e.swipestart.coords[0] <50) {
    // your logic 
    }
});

这是用于 x 坐标的类似，您可以从 coords[1] 获取 y

Answer 2

这适用于任何屏幕尺寸：

$("#main").on("swiperight",function( event ){
   // take 15% of screen good for diffrent screen size
   var window_width_15p = $( window ).width() * 0.15;
   // check if the swipe right is from 15% of screen (coords[0] means X)
   if ( event.swipestart.coords[0] < window_width_15p) {
      // open your panel
      $("#panel").panel("open");
   }
});

Answer 3

你可以这样做。

$('#main').on('touchstart', function(e) {
   var xPos = e.originalEvent.touches[0].pageX;
   if(xPos == 0) { //Keep in mind the margin of failure from 0, when user touches.
      //Handle edge swipe
   }
});