С помощью <input type=range> задаем количество товара. Цена единицы товара, перечисленная в массиве tariff[75,70,66,62,58,55] колеблется в зависимости от количества, чем больше товара, тем дешевле, по конкретным диапазонам:
Не получается сделать, что бы выбранно кол-во перемножалось на соответствующую цену, пробовал через switch...case, но все перемножается на первую цену из массива, что по идее логично.
Как сделать, что бы при выборе количества слайдером цена за единицу всегда подбиралась в соответствии с диапазоном?
Пример https://jsfiddle.net/wp8ow8vz/
function rangeCalc(i) {
var tariff = [[2, 75],[5, 70],[10, 66],[20, 62],[50, 58],[100, 55]];
$.each(tariff, function() {
if (this[0] <= i)
{
var price = this[1];
$('.calc-price').text(i*price);
}
})
};
$('.calc-range').on('input', function(){
$('.calc-count').text(this.value);
rangeCalc(this.value);
});
$(document).ready(function($) {
rangeCalc($('.calc-range').val());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h2>Сколько нужно кружек?</h2>
<input class="calc-range m-top-20" type="range" min="1" max="100" step="1" value="1">
Количество:<div class="calc-count">1</div>
Стоимость<span class="calc-price">100</span> руб
Апостиль в Лос-Анджелесе без лишних нервов и бумажной волокиты
Основные этапы разработки сайта для стоматологической клиники
Продвижение своими сайтами как стратегия роста и независимости