Jquery UI Slider - 输入值和滑块移动到位置

Question

我想知道是否有人找到了一个解决方案或示例来实际填充滑块的输入框并将其滑动到适当的位置onBlur()..目前,众所周知,它只是用您所在的位置更新此值在.所以在某些方面,我试图扭转这个惊人的滑块的功能.

我找到的一个链接:http://www.webdeveloper.com/forum/archive/index.php/t-177578.html有点过时了,但看起来他们试了一下.但是,结果的链接不存在.我希望那里可能有一个解决方案.

我知道长丝具有重新设计的滑块来处理选择(下拉)的值,它完美的作品.所以目标会做同样的,但有一个输入文本框.

Answer 1

这会做你想要的吗？

$("#slider-text-box").blur(function() {
  $("#slider").slider('option', 'value', parseInt($(this).val()));
});

滑块上的每个选项都有一个setter和一个getter,因此您可以使用它设置值,如上例所示.从文档:

//getter
var value = $('.selector').slider('option', 'value');
//setter
$('.selector').slider('option', 'value', 37);

更新:

对于双滑块,您需要使用:

$("#amount").blur(function () {
  $("#slider-range").slider("values", 0, parseInt($(this).val()));
});
$("#amount2").blur(function () {
  $("#slider-range").slider("values", 1, parseInt($(this).val()));
});

您需要使用Math.min/max以确保一个值不会传递另一个值,因为setter似乎不会阻止这一点.

当你使用它$("#slider-range").slider("values", 0)来获取每个值时,你几乎就在那里.很多jQuery都有这种get/set约定,其中使用额外的参数来设置值.