/* applies only to elements clicked in the content. For elements such as dragging, you need to work on the page yourself.
* Mainly binds Touchstart and touchmove events, and determines how many pixels the finger moves after the user presses it.
* If your finger moves less than 10 pixels, you still think the user is doing a click. If the moving distance exceeds 10 pixels, the execution of subsequent event listener functions is canceled. */
<script type= "Text/javascript" >functionMaketouchablebutton (ele) {if(!ele) {Console.error ("Miglobals.maketouchablebutton Invalid Element!" "); return false; } ele.addeventlistener ("Touchstart",function(evt) { This. SetAttribute ("data-moved", "N"); varp = evt.touches[0]; This. SetAttribute ("Data-touch-start-clientx", P.clientx); This. SetAttribute ("Data-touch-start-clienty", P.clienty); }); Ele.addeventlistener ("Touchmove",function(evt) {if( This. getattribute ("data-moved") = = "Y")return false; varp = evt.touches[0]; varStartclientx = parseint ( This. getattribute ("Data-touch-start-clientx"), 10); varStartclienty = parseint ( This. getattribute ("Data-touch-start-clienty"), 10); varDeltaX = P.clientx-Startclientx; varDeltaY = P.clienty-Startclienty; if(Math.Abs (deltax) > 10 | | Math.Abs (DeltaY) > 10) { This. SetAttribute ("data-moved", "Y"); } }); Ele.addeventlistener ("Touchend",function(evt) {if( This. getattribute ("data-moved") = = "Y") {evt.stopimmediatepropagation (); return false; } }); } varDIVs = Document.queryselector (". Touchdiv"); Maketouchablebutton (divs); Divs.addeventlistener ("Touchend",function() {Console.log ("You clicked on Me." "); }); </script>
Mobile Touchstar, Touchmove, touchend events do not allow the triggering of Touchend events if the page has scrolling.