mouse click event.pagex is NaN in mobile chrome br

问题:

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`