mouse click event.pagex is NaN in mobile chrome browser (v30.0.1599.92)

别来无恙 提交于 2019-12-11 10:47:27

问题


I'm trying to display a info box kind of element at the position where the user clicks. I'm listening to 'click' event, a handler function uses mouse click even object's event.pageX and event.pageY to render the info box. This works perfectly in the desktop browser. I tried hitting the page from a mobile client. event.pageX and event.pageY seem to be "NaN". Any idea why??

portion of the handler is as follows.

var pushPinClickEventHandler = function (event) {
    var clickX = event.pageX;
    var clickY = event.pageY;
    //do some thing here
}

edit: adding details about the mouse event object

desktop:

isPrimary: true
isSecondary: false
isTouchEvent: undefined
pageX: 136
pageY: 269

Mobile:

isPrimary: false
isSecondary: false
isTouchEvent: true
pageX: NaN
pageY: NaN

回答1:


The solution i've found is to override values of event.pageX and event.pageY with event.originalEvent.x and event.originalEvent.y.

After that, you can get positions calling event.getX(), event.getY().




回答2:


This solution works for me. I use :

`event.changedTouches[0].pageX`  
`event.changedTouches[0].pageY`  

in replacement of

`event.pageX`  
`event.pageY`


来源:https://stackoverflow.com/questions/19689181/mouse-click-event-pagex-is-nan-in-mobile-chrome-browser-v30-0-1599-92

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!