确定event 里面存在pageX 或 originalEvent.touches[0].pageX吗
时间: 2024-04-15 14:29:59 浏览: 21
在常见的浏览器事件对象中,确实存在 `pageX` 和 `originalEvent.touches[0].pageX` 属性。但需要注意的是,不同的事件对象可能会提供不同的属性来表示页面上的X坐标。
在鼠标事件对象(如 `click`、`mousedown`、`mousemove`、`mouseup` 等)中,可以直接通过 `event.pageX` 来获取鼠标相对于页面的X坐标。
在触摸事件对象(如 `touchstart`、`touchmove`、`touchend` 等)中,可以通过 `event.touches[0].pageX` 或 `event.changedTouches[0].pageX` 来获取触摸点相对于页面的X坐标。这里需要注意的是,触摸事件对象中的坐标信息存储在 `touches` 数组或 `changedTouches` 数组中,我们需要通过索引 `[0]` 来获取第一个触摸点的坐标。
以下是一个示例代码,展示了如何根据不同的事件类型获取页面上的X坐标:
```javascript
$("#flipbook").on("mousedown touchstart", function(event) {
var startX;
if (event.pageX) {
startX = event.pageX; // 鼠标事件
} else if (event.touches && event.touches.length > 0) {
startX = event.touches[0].pageX; // 触摸事件
}
console.log("startX:", startX);
});
```
在上述示例中,我们使用了 `mousedown` 和 `touchstart` 事件来监听鼠标和触摸事件,并通过判断事件对象的属性来获取页面上的X坐标。
请注意,以上示例仅适用于常见的浏览器事件对象,不同的事件类型可能会提供不同的属性来表示坐标信息。确保在使用时,根据实际的事件类型和事件对象来获取正确的坐标信息。
希望这能解决你的疑问。如果还有其他问题,请随时提问。