Mobile Javascript : prevent “touchend” handler if the user stop the scrolling with a tap

问题

I'm facing an issue in mobile JS development : (I'm speaking about my issue in iOS while I can't fix my problem, then I'll worry about Android ...)

I have a list of elements (of the iMessage app style, like a TableView in xCode) that is scrollable, I added an touchend EventListener to that list to detect when the user want to know more about one element. I differentiate the scroll and the "tap" (because the scroll fire the touchend event too) with these EventListeners applied to the document :

    var move = false;
    var startX = 0,
        startY = 0;
    var sameElement;

    document.addEventListener("touchstart", function (event) {

        move = false;
        startX = event.touches[0].clientX;
        startY = event.touches[0].clientY;
        sameElement = event.target;

    });

    document.addEventListener("touchmove", function (event) {

        var X = 10;
        var Y = 10;
        if (sameElement == event.target) {
            X = 120; // Increase abscissa tolerance margin if the move stay on the same element
        }
        if (Math.abs(event.touches[0].clientX - startX) > X ||
            Math.abs(event.touches[0].clientY - startY) > Y) {
            move = true;
        }
    });

and then I can ignore that event if the user scrolled :

someElement.addEventListener("touchend", function (event) {
    if(move) {
         return;
    }
});

The problem is that, in iOS natives app (Android too, I guess), the user can "stop" a fast scroll with a tap, e.g. : If you scroll "quickly" on the Facebook's messenger app and then touch the screen, the scroll animation stops and you stay on the conversations' list.

In my case, if I do this, the touchend event attached to someElement fires immediatly, I want to immitate the behavior of native app (if the user scroll quickly and directly touch the screen, it will stop the scroll, and prevent firing touchend code. Obviously, if the user touch the screen again, when someElement isn't scrolling, it will fire the touchend event ...). I've discover that iOS stops automatically the scrolling if the user touch the screen, but I can't prevent the touchend event from firing ...

I've found a simiar issue on StackOverflow, the guy seems have found a solution (see the edit), I've tried it but it doesn't work ... or I not really understand what he means.

Thanks a lot !

David

来源：https://stackoverflow.com/questions/30021334/mobile-javascript-prevent-touchend-handler-if-the-user-stop-the-scrolling-wi