多个滑块和平均

我需要显示10滑块范围分钟：最后一个（第10）是9个其他滑块的平均值。多个滑块和平均

对于我已经通过每次

$("#slider-range-min9").slider({ 
       range: "min", 
       value: 10, 
       min: 1, 
       max: 20, 
       slide: function(event, ui) { 
        $("#amount9").text("$" + ui.value); 
       } 
      }); 

$("#amount9").text("$" + $("#slider-range-min9").slider("value"));

而对于平均我已经重复相同的码也和修改的值变更ID重复相同的码9时间（是最佳）：

value: (($("#slider-range-min1").slider("value")+$("#slider-range-min3").slider("value")+$("#slider-range-min2").slider("value")+$("#slider-range-min4").slider("value")+$("#slider-range-min5").slider("value")+$("#slider-range-min6").slider("value")+$("#slider-range-min7").slider("value")+$("#slider-range-min8").slider("value")+$("#slider-range-min9").slider("value"))/9),

的问题是，这个滑块的值在现场（10日）一点儿也不变化，我注意到，我的网页是有点重。

是否有任何其他意思，使与优化的代码是一回事吗？

我会很感激

来源

2012-09-20 ranell

“我已经重复了9次相同的代码（这是最佳吗？）”根本不是。 – j08691

http://jsfiddle.net/YPWY8/

$(".slider").slider({ 
    range: "min", 
    value: 10, 
    min: 1, 
    max: 20, 
    slide: function(event, ui) { 
     if ($(this).hasClass("avg")){ 
      event.preventDefault(); 
      return false; 
     } 

     var sliders = $(".slider:not(.avg)"); 
     var val = 0, len = sliders.length; 
     sliders.each(function(i, ele){ 
      val += $(ele).slider("option", "value"); 
     }); 

     var newVal = Math.round(val/len); 

     $(".slider.avg").slider("option", "value", newVal); 
    } 
});

HTML

<div class="slider"></div> 
<div class="slider"></div> 
<div class="slider"></div> 
<div class="slider"></div> 
<div class="slider"></div> 
<div class="slider"></div> 
<div class="slider"></div> 
<div class="slider"></div> 
<div class="slider"></div> 
<div class="slider avg"></div>

来源

2012-09-20 19:57:52 Shmiddty

它就像一个魅力:)感谢很多！ – ranell

我试图显示每个滑块对应的数量，它的工作原理，但它不稳定：/ var val = 0，j = 1，len = sliders.length; （功能（i，ele）{ \t \t \t \t $（“＃amount”+ j）.text（$（ele）.slider（“option”，“value”））; val + = $ （ele）.slider（“option”，“value”）; \t \t \t j ++; }）; HTML：

– ranell

你可以使用CSS3招这样的：http://jsfiddle.net/YPWY8/1/ – Shmiddty

这个怎么样jsFiddle example？

$(".slider").slider({ 
    range: "min", 
    value: 10, 
    min: 1, 
    max: 20, 
    slide: function(event, ui) { 
     var avg = 0; 
     $('.slider').each(function() { 
      avg += $(this).slider('value'); 
     }); 
     $("#amount9").text("$" + avg/9); 
     $("#slider-range-min10").slider('value',avg/9); 
    } 
}); 

$("#slider-range-min10").slider({ 
    range: "min", 
    value: 10, 
    min: 1, 
    max: 20 
});

来源

2012-09-20 19:59:50 j08691

+1用于缩小和演示。 – undefined

这几乎是我要找的，非常感谢！ – ranell

多个滑块和平均

回答

相关问题