iOS 9 setTimeout（）問題

Question

我想使用JS來計算用戶行進的距離。 以下內容適用於移動模式下的chrome，但是當我切換到iOS時，沒有任何效果。 我做了一些挖掘，發現移動上的setTimeout（）有一些特別之處，盡管給定的解決方案不起作用。 如果刪除setTimeout（），則所有內容都可以在iOS上運行，但是啟動速度太快，無法記錄良好的運動。

window.addEventListener('load', function(){


var box1 = document.getElementById('box1');
var statusdiv = document.getElementById('statusdiv');
var startx = 0;
var starty = 0;
var dist = 0;

box1.addEventListener('touchstart', function(e){ e.preventDefault(); });

box1.addEventListener('touchmove', function(e){

    var touchobj = e.changedTouches[0];

    startx = parseInt(touchobj.clientX);
    starty = parseInt(touchobj.clientY);

    setTimeout(function(){

        var dist = Math.sqrt(Math.pow(parseInt(touchobj.clientX) - startx,2) + Math.pow(parseInt(touchobj.clientY) - starty,2));
        var angleDeg = 180 - Math.atan2((parseInt(touchobj.clientY) - starty) , (parseInt(touchobj.clientX) - startx)) * (180 / Math.PI);
        statusdiv.innerHTML = 'Status: touchmove<br> Horizontal distance traveled: ' + dist + 'px';

    } , 50);

    e.preventDefault();

}, false)


}, false)

Answer 1

我沒有按照自己的意願進行清理，但是可以工作。 我切換了它，所以它改為間隔運行。

window.addEventListener('load', function(){


function calc(){
    var dist = Math.sqrt(Math.pow(parseInt(touchobj.clientX) - startx,2) + Math.pow(parseInt(touchobj.clientY) - starty,2));
    var angleDeg = 180 - Math.atan2((parseInt(touchobj.clientY) - starty) , (parseInt(touchobj.clientX) - startx)) * (180 / Math.PI);
    statusdiv.innerHTML = 'Status: touchmove<br> Horizontal distance traveled: ' + dist + 'px';

    startx = parseInt(touchobj.clientX);
    starty = parseInt(touchobj.clientY);
}

var box1 = document.getElementById('box1');
var statusdiv = document.getElementById('statusdiv');
var startx = 0;
var starty = 0;
var dist = 0;
var intThing;
var touchobj;

box1.addEventListener('touchstart', function(e){ 

    intThing = setInterval(calc, 50);
    e.preventDefault(); 

});

box1.addEventListener('touchmove', function(e){

    touchobj = e.changedTouches[0];

    e.preventDefault();

}, false)

box1.addEventListener('touchend', function(e){ 

    clearInterval(intThing);
    e.preventDefault(); 

});


}, false)