Есть ли такая вещь, как событие onidle окна JavaScript

Question

function init() {
    //$.ajax({url: blah-blah-blah...});
    window.myTimer = setTimeout(init, 1000);
    return;
}

У меня работает цикл init();, и я хотел бы очистить его, когда мой оконный объект изменяется (изменяется, перемещается и т. Д.).

Когда я закончуделая это, я надеялся, что смогу вызвать что-то похожее на: window.addEventListener('idle', function() { if (!window.myTimer) { init(); } });

Я думал, что будет достаточно безопасно просто возобновить через:

window.addEventListener('mouseup', function() { if (!window.myTimer) { init(); });

однако этот даже не работает, как я ожидал для этой цели, и он игнорирует аспект прокрутки.Я также пробовал событие onchange, и оно запускается, когда все меняется.

Есть идеи?

Answer 1

Итак, после прочтения и получения момента, чтобы все это проверить;вот основы моей интерпретации функции requestIdleCallback ( MDN Reference ).

/* Global Variable Declarations */
window.myTimer = null;
window.counter = 0;
/* END Global Variable Declarations */

function init() {
	/* My Custom checking code here */
        document.getElementById('counter').innerHTML = window.counter+"";
	console.log(window.counter);
	window.counter += 1;
	/* End My Custom checking code */
	
	/* Non-Blocking Loop */
	window.myTimer = setTimeout(init, 50);
	/* End Non-Blocking Loop */
}

/* Event Listener Declarations */
window.addEventListener("change", function() { clearInterval(window.myTimer); window.myTimer = null; });
window.requestIdleCallback(function() { if (!window.myTimer) { init(); } });
/* END Event Listener Declarations */

<div id="counter"></div>

Я проверил опубликованный код вместе с моим jJuery ajax-кодом в Chrome, и все это, кажется, работает хорошо.

Это было оченьПрямо вперед по сравнению с попыткой отловить все другие возможные состояния событий!

---

Я проверил следующую интерпретацию в Edge, и она, похоже, работала довольно хорошо:

function msDiff(timeStamp) {
	var a = timeStamp;
	var oMS = (a.getHours()*60*60*1000) + (a.getMinutes()*60*1000) + (a.getSeconds()*1000) + a.getMilliseconds();
	var b = new Date();
	var nMS = (b.getHours()*60*60*1000) + (b.getMinutes()*60*1000) + (b.getSeconds()*1000) + b.getMilliseconds();
	return nMS - oMS;
}

/* Global Variable Declarations */
window.myTimer = null;
window.myPause = new Date();
window.counter = 0;
/* END Global Variable Declarations */

function init() {
	/* My Custom checking code here */
        document.getElementById('counter').innerHTML = window.counter+"";
	console.log(window.counter);
	window.counter += 1;
	/* End My Custom checking code */
	
	/* Non-Blocking Loop */
	window.myTimer = setTimeout(init, 50);
	/* End Non-Blocking Loop */
}

function myPauseLoop() {
	if (msDiff(window.myPause) > 500) {
		init();
		return;
	} else {
		setTimeout(myPauseLoop, 500);
	}
}

/* Event Listener Declarations */
window.addEventListener("change", function() { 
	clearInterval(window.myTimer); 
	window.myTimer = null; 
	window.myPause = new Date();
});
/* End Event Listener Declarations */

init();

<div id='counter'></div>