javascript - 如何禁用多 handle slider 中的 handle ？

Question

我需要一个带有 2 个 handle 的 slider ，一个可拖动，另一个固定。我正在使用 Jquery UI slider 。这是我到目前为止尝试过的:http://jsfiddle.net/8KnJ7/210/

$("#slider").slider({
      values:[1,1],
      min:0,
      max:5,
      slide: function(event, ui) {
        $(ui.handle).text(ui.value);
      }
   });
   var value = $("#slider").slider("values",0);
   $("#slider").find(".ui-slider-handle").text(value); 

我的问题是我无法禁用一个 handle 并保持另一个可拖动。基本上，固定 handle 应该显示实际速率，而可拖动 handle 应该显示我们要设置的速率。我想只保留一个 handle (可拖动的 handle )，并在 slider 上显示实际值作为不同颜色的条，但我无法在 slider 上显示任何内容。

Answer 1

看看这个例子。

$("#slider").slider({
  values:[1,1],
  min:0,
  max:5,
  slide: function(event, ui) {
    $(ui.handle).text(ui.value);
  },
  start: function( event, ui ) {
      if($(ui.handle).hasClass('stay'))
          return false;
  }
}); 
var value = $("#slider").slider("values",0);
$("#slider").find(".ui-slider-handle").text(value); 
$('#slider .ui-slider-handle:last').addClass('stay');

http://jsfiddle.net/8KnJ7/211/