Сумма в зависимости от значения

95
09 августа 2019, 02:40

есть 2 слайдера(input range) подскажите, как в зависимости от значений month и cash менять значение формулы. Думал функцию создать и передавать параметры, но что-то туплю

сумма = cash * (13/100)*month
$( ".cash #slider-range-max" ).slider({
        range: "max",
        min: 1000,
        max: 500000,
        value: 1000,
        slide: function( event, ui ) {
            $( ".cash #amount" ).val( ui.value );
            $( ".cash .amount" ).html( ui.value +"в‚Ѕ" );
        }
    });
    $( ".cash #amount" ).val( $( "#slider-range-max" ).slider( "value" ) +"в‚Ѕ" );
    $( ".cash .amount" ).html( $( "#slider-range-max" ).slider( "value") +"в‚Ѕ" );
    $( ".month #range-mounth").slider({
        range: "max",
        min: 1,
        max: 12,
        value: 1,
        slide: function( event, ui ) {
            $( ".month #amount" ).val( ui.value );
            $( ".month .amount" ).html( ui.value +" месяцев" );
        }
    });
    $( ".month #amount" ).val( $( "#range-mounth" ).slider( "value" ) +" месяцев" );
    $( ".month .amount" ).html( $( "#range-mounth" ).slider( "value" ) +" месяцев" );
Answer 1

Вроде такого?

$(function () { 
 
	function calcSumm() { 
		var cash = +$("#slider-range-max-cash").slider("value"); 
		var months = +$("#slider-range-max-month").slider("value"); 
		var summ = cash * (13 / 100) * months; 
		$(".summ").html(summ); 
	} 
 
	$(".cash #slider-range-max-cash").slider({ 
		range: "max", 
		min: 1000, 
		max: 500000, 
		value: 1000, 
		slide: function (event, ui) { 
			$(".cash #amount").val(ui.value); 
			calcSumm(); 
		} 
	}); 
	$(".cash #amount").val($("#slider-range-max-cash").slider("value")); 
 
	$(".month #slider-range-max-month").slider({ 
		range: "max", 
		min: 1, 
		max: 12, 
		value: 1, 
		slide: function (event, ui) { 
			$(".month #month").val(ui.value); 
			calcSumm(); 
		} 
	}); 
	$(".month #month").val($("#slider-range-max-month").slider("value")); 
   
	calcSumm(); 
 
});
body { 
  padding: 10px; 
} 
 
.cash, 
.month { 
  width: 50%; 
} 
 
#amount, 
#month { 
  text-align: right; 
  width: 50px; 
  margin-right: 10px; 
  margin-bottom: 10px; 
}
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
  <link rel="stylesheet" href="/resources/demos/style.css"> 
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
   
<div class="cash"> 
  <label for="amount">Price:</label> 
  <input type="text" id="amount" readonly style="border:0; color:#f6931f; font-weight:bold;">в‚Ѕ 
   
  <div id="slider-range-max-cash"></div> 
 
</div> 
 
<br> 
 
 <div class="month"> 
  <label for="month">Month:</label> 
  <input type="text" id="month" readonly style="border:0; color:#f6931f; font-weight:bold;">месяцев 
   
  <div id="slider-range-max-month"></div> 
 
</div> 
 
 
<br> 
 
<div>Сумма: <span class="summ"></span></div>

READ ALSO
Выводить данные с БД mysql на график (библиотека D3)

Выводить данные с БД mysql на график (библиотека D3)

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

110
Webpack, Typescript, запуск кода после загрузки DOM

Webpack, Typescript, запуск кода после загрузки DOM

Вопрос заключается в следующем: Есть класс ts, например меню, элементы которого являются приватным свойством, в конструкторе они берутся через...

94
Как правильно составить html pattern

Как правильно составить html pattern

В поле задаю тип string, и нужно чтобы проверялось на количество символов, максимально 7 штук, и чтобы можно было вводить только цифры в виде строкиКак...

126
Загрузка изображений в папку dist

Загрузка изображений в папку dist

Не получается при сборке проекта через webpack перенести все изображения из папки src/imadges в папку dist/imades чтобы сохранились путиИспользую file-loader

112