javascript - 想要将输入字段绑定(bind)到 jquery-ui slider 句柄

Question

我想将输入字段绑定(bind)到 jquery-ui slider 句柄。因此，每当一个值发生变化时，我希望另一个值也发生变化。例如:如果有人在最​​小值输入字段中键入 1000，我希望下方 slider handle 移动到 1000 标记。此外，如果用户将下方的 slider handle 拖动到 1000，输入字段应该会反射(reflect)出来。

让 slider 反射(reflect)输入字段的变化很容易:

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

我只需要帮助让文本字段模仿 slider 。

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

有什么想法吗？

此站点的类似问题:Jquery UI Slider - Input a Value and Slider Move to Location

Answer 1

仔细查看 JQuery UI's page about the range slider 上的示例代码.

您可以通过 ui 对象访问 slider 的值。比如:

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