@Aslero

Slider Range ввод в поле?

подскажите как обработать ввод в инпуты и чтобы ползунок менял значение

$( ".cash #slider-range-max" ).slider({
        range: "max",
        min: 30000,
        max: 999000,
        value: 30000,
        slide: function( event, ui ) {
            $( ".cash #amount" ).val( ui.value );
            $( ".cash .amount-title" ).html( ui.value +"₽" );
            calcSumm();
        }
    });
    $( ".cash #amount" ).val( $("#slider-range-max" ).slider( "value" ));
    $( ".month #range-mounth").slider({
        range: "max",
        min: 1,
        max: 12,
        value: 1,
        slide: function( event, ui ) {
            $( ".month #month" ).val( ui.value );
            $( ".month .month-title" ).html( ui.value +" месяцев" );
            calcSumm();
        }
    });
    $( ".month #month" ).val($( "#range-mounth" ).slider( "value" ));


<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>jQuery UI Slider - Slider bound to select</title>
  <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>
  <script>

  </script>
</head>
<body>
 
<div class="data-item cash">
    <span class="title">Сумма инвестиций *:</span>
    <span class="amount-title"></span>
    <input type="text" id="amount" name="amount" value="30000">
    <div id="slider-range-max"></div>
</div>
<div class="data-item month">
    <span class="title">Срок инвестиций *:</span>
    <span class="month-title"></span>
    <input type="text" id="month" name="month" value="1">
    <div id="range-mounth"></div>
</div>
</body>
</html>
  • Вопрос задан
  • 331 просмотр
Решения вопроса 1
0xD34F
@0xD34F Куратор тега JavaScript
$('.data-item').on('input', 'input', function() {
  $(this).closest('.data-item').find('.ui-slider').slider('value', $(this).val());
});
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы