Mobile Javascript: Prevent "touchhend" handler if user stops scrolling with a tap

I ran into a problem in mobile JS development: (I'm talking about my problem in iOS, until I can fix my problem, then I'll worry about Android ...)

I have a list of items (iMessage app style like TableView in xCode) that is scrolling, I added an indirect EventListener to this list to determine when the user wants to know more about a single item. I distinguish between scrolling and "faucet" (because scrolling fires a touchhend event) 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 this event if the user has scrolled:

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

      

The problem is, in the iOS natives app (Android too, I think), the user can "stop" a fast scroll with a tap, eg .: If you scroll "fast" in the Facebook messenger app and then tap the screen, the scroll animation will stop. and you will remain in the conversation list.

In my case, if I do this, the touchhend event attached to some element is triggered immediately, I want to change the behavior of my own application (if the user quickly scrolls and directly touches the screen, it stops scrolling and prevents the user from touching the screen again when some- then the element is not scrolling, it will miss the touchhend event ...). I found that iOS automatically stops scrolling if the user touches the screen, but I can't prevent the touchhend event from firing ...

I found an issue on StackOverflow question ... , the guy seems to have found a solution (see edit), I tried it but it doesn't work ... or I don't quite understand what he means.

Thank you so much!

David

+3
javascript android ios mobile-safari cordova


source to share


No one has answered this question yet

See similar questions:

2
detect if touchstart / touchhend canceled the scroll (scrolling by pulse)

or similar:

1494
Scroll to the top of the page using JavaScript?
1310
Stop setInterval call in JavaScript
585
How do I delay the .keyup () handler until the user stops typing?
4
Disabling mobile phonegap app while scrolling selects wrong item
2
Detecting sudden stop scrolling in UIScrollView
2
detect if touchstart / touchhend canceled the scroll (scrolling by pulse)
1
How to stop scrolling on touchhend using mobile safari?
0
Tap to stop impulse scrolling, also triggers tap event in webview
0
How to stop triggering touchhend event on touchstart using trunk
0
stop any touch events if touch occurs



All Articles
Loading...
X
Show
Funny
Dev
Pics