Я хотел бы вывести два значения из одного диапазона noUIslider. Используя примеры в документации noUIslider, я дошел до того, что я могу вывести одно и то же значение дважды, но я хочу, чтобы один из выходов отображал значение, которое было передано через математическое уравнение (например, 2 или 3) что он показывает другой выход.Вывод двух значений из одного noUISlider
Мои силы javaScript/jQuery слабы, поэтому, пожалуйста, будьте терпеливы со мной.
// Setting up the slider
var tooltipSlider = document.getElementById('slider-tooltip');
noUiSlider.create(tooltipSlider, {
start: [40000],
step: 10000,
range: {
'min': 40000,
'max': 5000000
},
format: wNumb({
decimals: 3,
thousand: '.',
prefix: '£ ',
})
});
var tipHandles = tooltipSlider.getElementsByClassName('noUi-handle'),
tooltips = [];
// Add divs to the slider handles.
for (var i = 0; i < tipHandles.length; i++) {
tooltips[0] = document.createElement('div');
tipHandles[0].appendChild(tooltips[0]);
}
// Add a class for styling
tooltips[0].className += 'score';
// Add additional markup
tooltips[0].innerHTML = '<strong>Price </strong><span></span>';
// Replace the tooltip reference with the span we just added
tooltips[0] = tooltips[0].getElementsByTagName('span')[0];
// When the slider changes, write the value to the tooltips.
tooltipSlider.noUiSlider.on('update', function (values, handle) {
tooltips[handle].innerHTML = values[handle];
});
// When the slider changes, write the value again + maths
var rangeSliderValueElement = document.getElementById('slider-range- value');
tooltipSlider.noUiSlider.on('update', function (values, handle) {
rangeSliderValueElement.innerHTML = 'Price + Math: ' + values[handle];
});
Я создал JSFiddle, что у меня до сих пор: https://jsfiddle.net/jherit/qhgd9to0/1/