Пытаюсь проинициализировать noUiSlider в цикле. Сам слайдер имеет систему событий и функции жестко определены, функция не позволяет передавать идентификатор слайдера в тело события, и я беру идентификатор из цикла.
Проблема заключается в том, что все проинициализированные обработчики событий работают с последним проинициализированным в цикле идентификатором.
curSlider.noUiSlider.on('update', function(values, handle) {
//обработка событий
})
Инициализируем объект:
$shopfilter.filter = [
{
'sliderId': 'filter-price',
'fromId': 'filter-price-from',
'toId': 'filter-price-to'
},
{
'sliderId': 'filter-power',
'fromId': 'filter-power-from',
'toId': 'filter-power-to'
}
];
Сам код:
$shopfilter.initSliders = function() {
for (var i=0; i<$shopfilter.filter.length; i++) {
var filter = $shopfilter.filter[i];
var curSlider = $utils.findElementById(filter['sliderId']);
var curSlider_from = $utils.findElementById(filter['fromId']);
var curSlider_to = $utils.findElementById(filter['toId']);
var curInputs = [curSlider_from, curSlider_to];
//инициализируем слайдер
noUiSlider.create(curSlider, {<ничего интересного>});
curSlider.noUiSlider.on('update', function(values, handle) {
//вот тут проблема
//несмотря на то, что функиция анонимная
//все curInputs указывают на тот, что был проинициализирован в последнем цикле
curInputs[handle].value = Math.round(values[handle]);
});
}
};
Удалось решить проблему вот так, но решение выглядит костыльным.
var initSliderUpdate = function(curInputs) {
curSlider.noUiSlider.on('update', function(values, handle) {
//вот сейчас все работает
curInputs[handle].value = Math.round(values[handle]);
});
};
initSliderUpdate(curInputs);
let/constвместоvar. – free_ze May 18 '18 at 09:22.forEach– nörbörnën May 18 '18 at 09:47(function(curSlider, curInputs){ curSlider.noUiSlider.on('update', ...); })(curSlider, curInputs)– Artem Gorlachev May 18 '18 at 09:53