Проблемы с использованием SetTimeout

Я создаю игру и используя функцию SetTimeout Javascript. Я хочу отслеживать время между каждым движением мыши, и для этого я использую SetTimeout. Проблема в том, что SetTimeout ВСЕГДА вызывается каждые x секунд (например, SetInterval). Я некоторое время смотрел на этот код и, может быть, я неправильно понял, что делает SetTimeout?Проблемы с использованием SetTimeout

Чтобы повторить, моя цель - измерить время между каждым «стоком» мыши, и кажется, что SetTimeout вызывается КАЖДОЕ x миллисекунды вместо одного раза. Пожалуйста, ознакомьтесь с приведенным ниже кодом для получения дополнительной информации.

Опять же, я хотел бы определить «удар» мыши с помощью SetTimeout. После «штриха» мыши (например, рисования линии) происходит пауза (в этом случае я определил это как 25 миллисекунд).

<html> 
<head> 
<title> My Game </title> 
<script type="text/javascript"> 
timeout = null; 
document.onmousemove = function(e) { 
    var event = e || window.event; 
    mouseX = event.clientX; 
    mouseY = event.clientY; 
    console.log(mouseX+","+mouseY); 
    clearTimeout(timeout); 
    timeout = window.setTimeout(
     function(){alert("New Mouse Movement") 
     },25); 
} 
</script> 
</head> 

<body> 
</body> 
</html>

источник

2014-01-05 Anonymous

'setTimeout()' используется для запуска функции, выполняемой после указанной задержки. Он не предназначен для измерения времени между двумя событиями. Один вызов 'setTimeout()' приведет к тому, что выполняемая вами функция будет выполняться только один раз, а не раз в каждые миллисекунды, но ваш код вызывает 'setTimeout()' для каждого события mousemove. Проверьте свою консоль - вы увидите, что ваш 'console.log()' встречается один раз за каждый тайм-аут ... – nnnnnn

Одна вещь, которую вы можете сделать, - это зафиксировать дату в нулевой переменной onmousemove, если переменная имеет значение null, если нет, то игнорируй это. Затем установите свой тайм-аут на 25, и если нет движения за 0,25 секунды, подумайте о том, что мышь остановлена, а затем вычитаем из конца. –

Да, именно поэтому я хотел бы определить «удар» мыши с помощью SetTimeout. После инсульта мыши есть некоторая пауза (я определил это как 25 миллисекунд в этом случае) –

Основываясь на моем комментарии, просто введите нулевое время. Затем, когда мышь перемещается, она устанавливает время начала и устанавливает таймер на 0,025 секунды. Если мышь продолжает двигаться, тогда она очистит таймаут и снова запустит таймер. Если мышь перестает двигаться, функция таймаута срабатывает и запишет время, потраченное на перемещение.

timeout = null; 
mouseStart=null; 
document.onmousemove = function(e) { 
    var event = e || window.event; 
    if(mouseStart===null){ 
     mouseStart=new Date(); 
    } 
    mouseX = event.clientX; 
    mouseY = event.clientY; 
    console.log(mouseX+","+mouseY); 
    clearTimeout(timeout); 
    timeout = window.setTimeout(
     function(){ 
      console.log((new Date()).getTime()-mouseStart.getTime()) 
      mouseStart=null; 
     },25); 
}

Скрипки, переместите мышь в круг, и как только вы прекращаете вы получите истекшее время движения мыши в миллисекундах (+25 миллисекунды): http://jsfiddle.net/rr4g2/

Примечание 25 миллисекунд Хелла быстро. Вы можете захотеть что-то вроде 300 миллисекунд, чтобы сделать немного более понятным, что мышь перестала двигаться.

источник

2014-01-05 00:41:47

Спасибо, Тим, это отличный ответ. –

Возможно, вы можете найти остальных, чтобы нарисовать ход между началом и остановкой :) –

Вы - alert Следующее новое движение мыши 25 мс после того, как это произойдет, а не время, когда промежуток между ними. setTimeout - это не то, что вам нужно.

Вместо этого на каждом движении мыши сохраняйте текущее время и вычитайте из него предыдущее время, затем alert что.

Редактировать: Я поменял местами alert на console.log, так как mousemove будет работать так часто.

var oldTime = Date.now(); 
document.onmousemove = function (e) { 
    var event = e || window.event; 
    mouseX = event.clientX; 
    mouseY = event.clientY; 
    console.log(mouseX+","+mouseY); 
    // Get the current time. 
    var newTime = Date.now(); 
    // Alert the difference. 
    console.log('Time between mouse strokes: ' + (newTime - oldTime) + 'ms'); 
    // Save the current time for the next movement. 
    oldTime = newTime; 
};

источник

2014-01-05 00:43:11

Проблемы с использованием SetTimeout

ответ

Смежные вопросы