2015-11-02 108 views
9

我創建如下面的滑塊,動態設置引導滑塊的值?

<input id="brightness" onChange="changeBrightness()" data-slider-id='ex1Slider' type="text" 
        data-slider-min="-100" data-slider-max="100" data-slider-step="2" data-slider-value="0"/> 

我需要動態設定值到該滑塊。我試過,

$("#brightness").slider('setValue', 8, true); 
$("#brightness").slider('refresh'); 

但是這是行不通的。我該怎麼做?

+1

不確定,但我猜'$(「#brightness」).val(8);'將它設置爲8? – Anders

+0

試過了,但沒有工作。 – Nidhish

回答

4

嘗試下面的腳本:

$(window).load(function() { 
    $("#brightness").attr('data-slider-value', 8); 
    $("#brightness").slider('refresh'); 
}); 
+1

錯誤:初始化之前無法在滑塊上調用方法;試圖調用方法'刷新'...​​我得到這個錯誤... – Nidhish

+0

@Nidhish你必須確保代碼在Bootrstrap初始化後運行。 (不知道如何在實際中做到這一點。)你可以嘗試在點擊事件或其他事情上運行它,看看它是否有效。 – Anders

+2

我最初加載了bootstrap-slider.js。並嘗試按鈕點擊事件上面的代碼。然後出現錯誤「錯誤:不能在初始化之前調用滑塊上的方法;試圖調用方法'值''... – Nidhish

2

這裏有幾件事情,你可以使用滑塊值做動態:jsfiddle

var slider = new Slider("#budget-slider-1"); 
var slider2 = new Slider("#budget-slider-2"); 

slider.on("change", function(slideEvent) { 
    var currentValueSlider2 = slider2.getValue(); 
    slider2.options.min = 80; 
    slider2.setValue(100); 
}); 
1

只有$("#brightness").slider('setValue', 8, true);

刷新初始值 $("#brightness").slider('refresh');