是否存在與'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來獲得一個具有pageX/Y clientX/Y等的Touch對象。

以下是相關文檔的鏈接：

• 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 。

Answer 5

在Touch類上查看Safari 開發人員參考 。

根據這個，pageX / Y應該可用 - 也許你應該檢查拼寫？ 確保它是pageX而不是PageX