Fixed Touchend event not triggered after mobile page scrolling

Resolves a touchend event issue when a mobile page scroll is not triggered

When you optimize on a mobile page, you typically use touch events instead of mouse-related events. Use the Touchend event instead of the PC-side click and MouseUp events.

However, the Touchend event has a problem when scrolling through the page. After scrolling, assuming that the current contact position refers to an element that is bound to the Touchend event, then the Touchend event of the element is triggered, causing the error to occur.

Workaround

The workaround is very easy. is to stop the Touchend event bubbling when the page scrolls. This prevents Touchend events from being triggered.

Usage

The function is introduced and called.

 function stoptouchendpropagationafterscroll(){    varLocked =false; Window.addeventlistener (' Touchmove ', function(EV){Locked | | (Locked =true, Window.addeventlistener (' Touchend ', Stoptouchendpropagation,true)); },true); function stoptouchendpropagation(EV){Ev.stoppropagation (); Window.removeeventlistener (' Touchend ', Stoptouchendpropagation,true); Locked =false; }}

Another explanation

On the mobile side, the scroll event is triggered only once after the scroll has ended. The Touchmove event is triggered several times during the sliding process. Using scroll can be a performance optimization over the use of touchmove.

But. The above code does not use the scroll event, but the Touchmove event. is to apply to pages that are smaller than one screen height at the same time. So I was forced to use Touchmove.

Fixed Touchend event not triggered after mobile page scrolling