andreruffert / rangeslider.js

🎚 HTML5 input range slider element jQuery polyfill
https://rangeslider.js.org
MIT License
2.16k stars 401 forks source link

[Error] TypeError: 'undefined' is not an object (evaluating 'e.originalEvent.touches[0].clientX') #73

Closed qwebmaster closed 9 years ago

qwebmaster commented 10 years ago

I get this error when using the slider on ios 5-7 (it does slide normally but once i lift my finger the error appears ).

Do to the error the callbacks don't fire (onside, onSlideEnd.. etc)

Here is what i got from the remote debug log on safari (demo has the same issue)

[[Warning] Invalid CSS property declaration at: ; (style.css, line 2406) [Error] TypeError: 'undefined' is not an object (evaluating 'e.originalEvent.touches[0].clientX') getRelativePosition (rangeslider.js, line 249) handleEnd (rangeslider.js, line 206) e (jquery.js, line 2) dispatch (jquery.js, line 3) handle (jquery.js, line 3)

qwebmaster commented 9 years ago

Thanks, it does fix the problem but the "onSlideEnd" function will no longer fire and i need that to function.

ghost commented 9 years ago

I got it working for me by modifying the getRelativePosition method (line 248)

Plugin.prototype.getRelativePosition = function(node, e) {
        var touch;
        if (e.originalEvent) {
            if (e.originalEvent.touches && e.originalEvent.touches.length) {
                touch  = e.originalEvent.touches;
            } else if (e.originalEvent.changedTouches && e.originalEvent.changedTouches.length) {
                touch = e.originalEvent.changedTouches;
            }
        }
        return (e.pageX || e.originalEvent.clientX || touch[0].clientX || e.currentPoint.x) - this.getPositionFromNode(node);
    };

taken partly from here http://www.jqwidgets.com/community/topic/dragend-event-properties-clientx-and-clienty-are-undefined-on-ios/

Hope this helps...

kantuni commented 9 years ago

Solution

Plugin.prototype.getRelativePosition = function(node, e) {
        var touch;
        if (e.originalEvent) {
            if (e.originalEvent.touches && e.originalEvent.touches.length) {
                touch  = e.originalEvent.touches;
            } else if (e.originalEvent.changedTouches && e.originalEvent.changedTouches.length) {
                touch = e.originalEvent.changedTouches;
            }
        }
        return (e.pageX || e.originalEvent.clientX || ((touch) ? touch[0].clientX : false) || 
            ((e.currentPoint) ? e.currentPoint.x : false)) - this.getPositionFromNode(node);
    };
andreruffert commented 9 years ago

This issue should be fixed since the new release v0.3.2