1

Есть слайдер выбора диапазона, который подставляет значение в инпут и в соответствующее поле на карточке оффера. введите сюда описание изображения

Я смогла написать код, который просчитывает сумму выплаты, учитывая ставку, однако это работает только для одного блока. Калькулятор берет последнее значение ставки и подставляет везде. Можно ли сделать так, чтобы в каждом блоке все просчитывалось отдельно?

 $('.sum-input').text(inp.val());
        inp.change (function() {
                var result = $('.result');
                var comissionSpan = $('.comission');
                var percents = +$('.percents').text();
                var zaim = +inp.val();
                var comission = zaim/100*percents*30;
                var resultVal = zaim+comission;
                $('.sum-input').text(inp.val());
                $(comissionSpan).text(comission);
                $(result).text(resultVal);
          });

Также нужно, чтобы блоки фильтровались относительно суммы займа. То есть если сумма займа 16000, то должны показываться только те офферы, в которых максимальная сумма займа >= 16000. Пыталась сделать таким образом, но это работает не так, как нужно

 var maxSum = +$('.max-sum').text();
     $('.offer').fadeOut(0);
     var count = 20;
     for (var i = 0; i < count; i++) {
      $('.max-sum').filter(function() {
        return $(this).text() >= inp.val();
      }).parentsUntil(".offers").fadeIn(0);
     }

Вот html код одного оффера

<div class="offer" id="1" style="border-color:#000">
	<div class="offer_feature">
		<span style="background-color:#000">
			Dinero
		</span>
	</div>
	<div class="offer_logo">
		<div class="offer_logo_con">
			<img src="img/dinero.png" alt="">
		</div>
		<div class="offer_rating">
			<div class="offer_rating_stars">
				<div class="offer_rating_stars_icons">
					<i class="icon_star"></i>
					<i class="icon_star"></i>
					<i class="icon_star"></i>
					<i class="icon_star"></i>
					<i class="icon_star"></i>
				</div>
				<div class="offer_rating_stars_icons_outline">
					<i class="icon_star_outline"></i>
					<i class="icon_star_outline"></i>
					<i class="icon_star_outline"></i>
					<i class="icon_star_outline"></i>
					<i class="icon_star_outline"></i>
				</div>
			</div>
		</div>
	</div>
	<div class="offer_info">
		<div class="offer_info_con">
			<div class="offer_money">
				<div>
					<div class="label">К выплате <br> за 30 дней</div>
					<div class="value result">
						<small>грн</small>
					</div>
				</div>
				<div>
					<div class="label">Сумма займа</div>
					<div class="value sum-input">
						<small>грн</small>
					</div>
				</div>
				<div>
					<div class="label">Комиссия</div>
					<div class="value ">
						<span class="comission"></span><small>грн</small>
					</div>
				</div>
			</div>
			<div class="offer_conditions">
				<div>
					<div class="label">Займ</div>
					<div class="value">
						300-<span class="max-sum">15 000</span> <small>грн</small>
					</div>
				</div>
				<div>
					<div class="label">Ставка</div>
					<div class="value ">
						<span class="percents">0</span> <small>% в день</small>
					</div>
				</div>
				<div>
					<div class="label">Срок</div>
					<div class="value">
						7-30 <small>дней</small>
					</div>
				</div>
			</div>
		</div>
		<div class="offer_open">
			<a onclick="dinero()" target="_blank" class="btn primary_btn"
				style="cursor: pointer;">Оформить заявку</a>
		</div>
	</div>
</div>

2
  • 1
    Не совсем понял, что надо сделать. Разместите пример вашего оффера в снипет
    – doox911
    26 июл 2019 в 9:17
  • @doox911 Добавила html код, там в первую очередь непонятно, как сделать калькулятор. Он считает правильно, но подставляет одинаковые значения во все офферы. На картинке видно, что комиссия у Dinero и Mycredit получается одинаковая, хотя процентная ставка у них разная. Получается калькулятор просчитывает все для последнего оффера и подставляет эти значения везде 26 июл 2019 в 10:38

1 ответ 1

2
  1. Можно ли сделать так, чтобы в каждом блоке все просчитывалось отдельно?

Вот так должно работать:

$('.sum-input').text(inp.val());
inp.change (function() {
    $('.sum-input').text(inp.val()); // вынесено из перебора, т.к. это значение у всех одинаковое
    $('.offer').each(function(){ // перебор по всем .offer
        var result = $(this).find('.result'); // $(this) - это текущий .offer в переборе среди всех оферов
        var comissionSpan = $(this).find('.comission');
        var percents = +$(this).find('.percents').text();
        var zaim = +inp.val();
        var comission = zaim/100 * percents * 30;
        var resultVal = zaim + comission;
        comissionSpan.text(comission);
        result.text(resultVal);
    });
});
  1. Также нужно, чтобы блоки фильтровались относительно суммы займа.

Попробуйте так:

$('.offer').fadeOut(0);
$('.offer').each(function(){
   if ($(this).find('.max-sum').eq(0).text() >= inp.val()) {
       $(this).fadeIn(0);
   }
});

Получилось? Если что-то не получилось, напишите что именно.

1
  • @EleneVasilenko Спасибо, все получилось) В фильтр еще добавила перевод значения inp.val() и max-sum в число, и все заработало 29 июл 2019 в 7:15

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.