如何你讓滑塊反映在輸入框中輸入所做的更改

Question

<div id='slider'></div> 
<div id='start'><input value="1"></div> 
<div id='stop'><input value="99"></div> 

$.ui.slider.prototype._slide = function (event, index, newVal) { 
       var otherVal, 
       newValues, 
       allowed; 

       if (this.options.values && this.options.values.length) { 
       otherVal = this.values(index ? 0 : 1); 
       if (newVal !== this.values(index)) { 
        newValues = this.values(); 
        newValues[ index ] = newVal; 
        // A slide can be canceled by returning false from the slide callback 
        allowed = this._trigger("slide", event, { 
        handle: this.handles[ index ], 
        value: newVal, 
        values: newValues 
        }); 
        otherVal = this.values(index ? 0 : 1); 
        if (allowed !== false) { 
        this.values(index, newVal, true); 
        } 
       } 
       } else { 
       if (newVal !== this.value()) { 
        // A slide can be canceled by returning false from the slide callback 
        allowed = this._trigger("slide", event, { 
        handle: this.handles[ index ], 
        value: newVal 
        }); 
        if (allowed !== false) { 
        this.value(newVal); 
        } 
       } 
       } 
      } 

$('#slider').slider({ 
    min: '0', 
    max: '99', 
    range: true, 
    values: [0,99], 
    slide: function(event, ui) { 
     if(ui.values[0] >= ui.values[1]) { 
              if(ui.handle == $("#slider a")[0]) { 
              $("#slider").slider("values", 1, ui.value+1); 
              ui.values[0] = ui.value; 
              ui.values[1] = ui.value+1; 
              } else { 
              $("#slider").slider("values", 0, ui.value-1); 
              ui.values[0] = ui.value-1; 
              ui.values[1] = ui.value; 
              } 
             } 

     var minutes0 = Math.floor(ui.values[0]); 


     var minutes1 = Math.floor(ui.values[1]); 


     $('#start input').val(minutes0); 
     $('#stop input').val(minutes1); 
    } 
}); 

小提琴：http://jsfiddle.net/Nk8ap/18/

現在，當我拖動處理程序的變化反映在文本框中。

但是我怎樣才能做到這一點，當我手動輸入數字時，這種變化反映在處理程序上？

Answer 1

您添加的事件處理程序的輸入，並更改滑塊值：

$('#start input, #stop input').on('change', function() { 
    var val = [$('#start input').val(), $('#stop input').val()]; 
    $("#slider").slider('values', val); 
}); 

FIDDLE