JQuery 1.7 clientX / pageX undefined

Question

I am using jQuery and drag and drop from jqueryUI. When I upgrade jQuery from 1.6 to 1.7, the clientX and pageX attributes disappear from the event variable. Here is an example:

http://jsbin.com/ezulas/7/edit

If in this example the version of jQuery is changed to 1.6.4, it starts working. With the latest version - clientX / Y and pageX / Y do not work. I found that I can use e = e.originalEvent, but this does not seem to be the right solution.

Answer 1

event.layerX and event.layerY: We removed these non-standard properties in version 1.7. Although we would usually go through a notification period for this, Chrome 16 generates a stream of console warning messages on the page. Because of this, we decided to remove immediately. On platforms that still support these properties, they are available through event.originalEvent.layerX and event.originalEvent.layerY.

Source: http://blog.jquery.com/2011/11/03/jquery-1-7-released/

When you console.log(e); inside your dragstop event dragstop , you can see that all x / y coordinate data is missing in jQuery 1.7; but it can be accessed in event.originalEvent .

UPDATE

If you look around the event object, you can find pageX / pageY in the origionalEvent property:

 $('#test').html(e.originalEvent.pageX+','+e.originalEvent.pageY); 

Here is the updated version of your jsbin: http://jsbin.com/ezulas/13/edit

Answer 2

I had the same problem, and I searched for similar topics for quite some time. Now it’s quite late, but I hope that this will save some happy coders from despair anyway. I checked the jQuery UI Touch Punch file, which I also used in my project, and found how it relates to the x / y position. This is what ultimately worked for me:

 $('.pages').on('touchstart vmousedown', function(e){ var this_event_touch_start_Y = e.originalEvent.changedTouches[0].clientY; var this_event_touch_start_X = e.originalEvent.changedTouches[0].clientX; }); 

For reference, here is a list of all jQuery files that I use:

• JQuery-3.1.1.min.js
• jquery.touchSwipe.min.js
• Jquery-ui.min.js
• jquery.ui.touch-punch.min.js
• jquery.mobile-1.4.5.min.js

Answer 3

JQuery docs for Event Object say

The following properties are also copied to the event object, although some of their values ​​may be undefined depending on the event:

altKey, bubbles, button, cancelable, charCode, clientX, clientY, ctrlKey, currentTarget, data, detail, eventPhase, metaKey, offsetX, offsetY, originalTarget, pageX, pageY, prevValue, relatedTarget, screenX, screenY, shiftKey, target, view, which the

Which seems to match what you say. In your situation, your event does not have the pageX and pageY parameters.