Мне нужно добавить задержку около 100 миллисекунд к моему Javascript-коду, но я не хочу использовать функцию setTimeout
объекта window
, и я не хочу использовать цикл занятости. У кого-нибудь есть предложения?
Положите задержку в Javascript
Ответ 1
К сожалению, setTimeout()
является единственным надежным способом (а не единственным способом, но единственным надежным способом), чтобы приостановить выполнение script без блокировки пользовательский интерфейс.
Это не так сложно использовать, а не писать:
var x = 1;
// Place mysterious code that blocks the thread for 100 ms.
x = x * 3 + 2;
var y = x / 2;
вы используете setTimeout()
, чтобы переписать его следующим образом:
var x = 1;
var y = null; // To keep under proper scope
setTimeout(function() {
x = x * 3 + 2;
y = x / 2;
}, 100);
Я понимаю, что использование setTimeout()
включает в себя больше мысли, чем желательная функция sleep()
, но, к сожалению, более поздняя версия не существует. Многие способы решения этой проблемы пытаются реализовать такие функции. Некоторые используют циклы занятости:
function sleep(milliseconds) {
var start = new Date().getTime();
for (var i = 0; i < 1e7; i++) {
if ((new Date().getTime() - start) > milliseconds){
break;
}
}
}
К сожалению, это временные решения и могут вызвать другие проблемы (например, замораживание браузеров). Рекомендуется просто придерживаться рекомендуемого способа, который setTimeout()
).
Ответ 2
У меня просто была проблема, когда мне нужно было решить это правильно.
Через Ajax, a script получает сообщения X (0-10). Что я хотел сделать: Добавьте одно сообщение в DOM каждые 10 секунд.
код, в котором я закончил:
$.each(messages, function(idx, el){
window.setTimeout(function(){
doSomething(el);
},Math.floor(idx+1)*10000);
});
В принципе, подумайте о тайм-аутах как "временной шкале" вашего script.
Это то, что мы хотим записать:
DoSomething();
WaitAndDoNothing(5000);
DoSomethingOther();
WaitAndDoNothing(5000);
DoEvenMore();
Это КАК НУЖНО СКАЗАТЬ ЭТО В JAVASCRIPT:
At Runtime 0 : DoSomething();
At Runtime 5000 : DoSomethingOther();
At Runtime 10000: DoEvenMore();
Надеюсь, что это поможет.
Ответ 3
Если с ES2017 у вас все в порядке, await
хорошо:
const DEF_DELAY = 1000;
function sleep(ms) {
return new Promise(resolve => setTimeout(resolve, ms || DEF_DELAY));
}
await sleep(100);
Обратите внимание, что часть await
должна быть в асинхронной функции:
//IIAFE (immediately invoked async function expression)
(async()=>{
//Do some stuff
await sleep(100);
//Do some more stuff
})()
Ответ 4
На самом деле только setTimeout
подходит для этого задания, и обычно вы не можете устанавливать точные задержки с неопределенными методами в качестве циклов занятости.
Ответ 5
Этот поток имеет хорошее обсуждение и полезное решение:
function pause( iMilliseconds )
{
var sDialogScript = 'window.setTimeout( function () { window.close(); }, ' + iMilliseconds + ');';
window.showModalDialog('javascript:document.writeln ("<script>' + sDialogScript + '<' + '/script>")');
}
К сожалению, похоже, что это не работает в некоторых версиях IE, но в потоке есть много других достойных предложений, если это окажется для вас проблемой.
Ответ 6
Используйте функцию AJAX, которая будет вызывать php-страницу синхронно, а затем на этой странице вы можете поместить функцию php usleep(), которая будет действовать как задержка.
function delay(t){
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("POST","http://www.hklabs.org/files/delay.php?time="+t,false);
//This will call the page named delay.php and the response will be sent to a division with ID as "response"
xmlhttp.send();
document.getElementById("response").innerHTML=xmlhttp.responseText;
}