是否存在与'touchstart'事件相同的e.PageX位置,因为有点击事件？

Question

我试图用一个touchstart事件的jQuery获得X位置,与live函数一起使用？

即

$('#box').live('touchstart', function(e) { var xPos = e.PageX; } );

现在,这可以使用'click'作为事件.如何(不使用alpha jQuery Mobile)我是否通过触摸事件获得它？

有任何想法吗？

谢谢你的帮助.

Answer 1

有点迟到,但你需要访问原始事件,而不是jQuery按摩一个.此外,由于这些是多点触控事件,因此需要进行其他更改:

$('#box').live('touchstart', function(e) {
  var xPos = e.originalEvent.touches[0].pageX;
});

如果你想要其他手指,你可以在触摸列表的其他索引中找到它们.

更新的JQUERY更新:

$(document).on('touchstart', '#box', function(e) {
  var xPos = e.originalEvent.touches[0].pageX;
});

Answer 2

我将这个简单的函数用于基于JQuery的项目

    var pointerEventToXY = function(e){
      var out = {x:0, y:0};
      if(e.type == 'touchstart' || e.type == 'touchmove' || e.type == 'touchend' || e.type == 'touchcancel'){
        var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0];
        out.x = touch.pageX;
        out.y = touch.pageY;
      } else if (e.type == 'mousedown' || e.type == 'mouseup' || e.type == 'mousemove' || e.type == 'mouseover'|| e.type=='mouseout' || e.type=='mouseenter' || e.type=='mouseleave') {
        out.x = e.pageX;
        out.y = e.pageY;
      }
      return out;
    };

例:

$('a').on('mousedown touchstart', function(e){
  console.log(pointerEventToXY(e)); // will return obj ..kind of {x:20,y:40}
})

希望这对你有用;)

Answer 3

我在这里尝试了其他一些答案,但originalEvent也未定义.经过检查,找到了一个TouchList分类属性(由另一张海报建议)并设法以这种方式到达pageX/Y:

var x = e.changedTouches[0].pageX;

Answer 4

如果您没有使用jQuery ...您需要访问其中一个事件TouchList来获取Touch具有pageX/Y clientX/Y等等的对象.

以下是相关文档的链接:

• https://developer.mozilla.org/en-US/docs/Web/Events/touchstart
• https://developer.mozilla.org/en-US/docs/Web/API/TouchList
• https://developer.mozilla.org/en-US/docs/Web/API/Touch

我在使用e.targetTouches[0].pageX我的情况.