Здравствуйте! Ломаю голову пол дня. Суть вопроса такова, есть N кол-во элементов c отложенной загрузкой на странице, по ним я прохожусь циклом и вешаю событие scroll. Которое необходимо уничтожить при первом вызове функции. Не уничтожается, висит в памяти...
var containers = document.getElementsByClassName('b-procent-counter__bar');
if( containers.length < 1 ) {
return false;
}
var scroll = function() {
if( ! elementShow(this) ) {
return false;
}
//***********
window.removeEventListener('scroll', this, false);
};
Array.prototype.forEach.call(containers, function (e) {
e.addEventListener('load', function () {
window.addEventListener('scroll', scroll.bind(e), false);
});
});
Я понимаю, что в removeEventListener необходимо передавать исходное состояние вызова scroll.bind(e). Но так как элемент в DOM не один, просто присвоить переменной и потом передать ее в removeEventListener, я не могу...
------- Переделал, теперь проблема в том, что данные добавляемые в массив, попадают в отложенном порядке (после события load). А событие scroll вешается сразу и при проверке на кол-во элементов массива, показывает пустоту (что весьма логично). И тут проблема: как только отрабатывает элемент в функции scroll, я его удаляю из массива, а потом проверяю. Если массив пуст, снимаю событие scroll, но оно снимается сразу, так как вешается до появления данных в массиве.
var loadElements = [];
var scroll = function (e, id) {
//********
loadElements.splice(id, 1);
};
Array.prototype.forEach.call(containers, function (e, i) {
e.addEventListener('load', function () {
loadElements.push(e);
});
});
window.addEventListener('scroll', function () {
if( loadElements.length < 1) {
return this.removeEventListener('scroll', arguments.callee);
}
Array.prototype.forEach.call(loadElements, scroll);
});
