帶滑動變化的引導滑塊鏈接輸入號碼

Question

我正在使用bootstrap-slider.js。我的問題是我無法將輸入號碼與幻燈片鏈接。如果輸入號碼改變，我也想滑動以改變。

滑塊

<div id="slider-year" class="search-block"> 
    <h2 class="title">Production year</h2> 
    <div class="slider-year-amount"> 
    <span class="pull-left">1900</span> 
    <span class="pull-right">2017</span> 
    </div> 
    <input type="text" class="year-slider" style="width:100%" data-slider-min="1900" data-slider-max="2017" data-slider-step="1" data-slider-value="[1900,2017]" /> 
    <div class="row"> 
    <div class="year-box"> 
     <div class="col-lg-6"> 
     <label>From</label> 
     <input type="number" min="1900" max="2019" class="form-control" placeholder="1900" id="minYear" value="1900" name="year_since"> 
     </div> 
     <div class="col-lg-6"> 
     <label>To</label> 
     <input type="number" min="1901" max="2020" class="form-control" placeholder="2017" id="maxYear" value="2017" name="year_to"> 
     </div> 
    </div> 
    </div> 
</div> 

我如何嘗試更新滑塊：

jQuery("#minYear").change(function() { 
    jQuery("#slider-year").slider('setValue', jQuery(this).val()); 
}); 

而且這裏是如果有人好奇，我沒有找到解決辦法有此滑塊文檔： http://www.eyecon.ro/bootstrap-slider

JsFiddle：https://jsfiddle.net/y95vfds3/6/

Answer 1

你想要這樣嗎？

$("#minYear").change(function() { 
     $("#slider-year").slider('setValue', jQuery(this).val()); 
    }); 

    val = $('.year-slider').slider(); 

    $('.year-slider').on('slide', function(ev) { 
     $('#minYear').val(ev.value[0]); 
     $('#maxYear').val(ev.value[1]); 
    }); 

https://jsfiddle.net/gnanavelr/y95vfds3/7/

https://jsfiddle.net/gnanavelr/y95vfds3/8/