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 that you have read and understand our privacy policy and code of conduct.

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