想要將輸入字段綁定到jquery-ui滑塊手柄

Question

我想將輸入字段綁定到jquery-ui滑塊句柄。 因此，每當一個值發生變化時，我希望另一個值也發生變化。 例如：如果有人在最​​小值輸入字段中鍵入1000，我希望下滑塊手柄移動到1000標記。 此外，如果用戶將下滑塊手柄拖動到1000，則輸入字段應該反映出來。

使滑塊反映輸入字段中的更改很容易：

$(minYearInput).blur(function () {
    $("#yearSlider").slider("values", 0, parseInt($(this).val()));
});
$(maxYearInput).blur(function () {   
    $("#yearSlider").slider("values", 1, parseInt($(this).val()));
});

我只需要幫助使文本字段模仿滑塊。

$("#yearSlider").slider({
    range: true,
    min: 1994,
    max: 2011,
    step: 1,
    values: [ 1994 , 2011 ],
    slide: function(event, ui) {
        //what goes here?
    }
}); 

有任何想法嗎？

來自此站點的類似問題： Jquery UI Slider - 輸入值和滑塊移動到位置

Answer 1

仔細查看JQuery UI頁面上有關范圍滑塊的示例代碼。

您可以通過ui對象訪問滑塊所具有的值。 如：

function(event, ui) {
    //what goes here?
    $(minyearInput).val(ui.values[0]);
    $(maxyearInput).val(ui.values[1]);
}