2012-12-03 27 views
3

我需要一些幫助。我有一個代碼http://jsfiddle.net/ZNvWR/19/。我是淘汰賽的新手,我找不到任何解決方案。淘汰賽js jquery範圍滑塊&& 2輸入

那麼,如何重寫這個代碼獲取工作輸入(改變輸入更改滑塊值)?

<div data-bind="jqSlider: percent, jqOptions: { min: 0, max: 100, range:true }"></div> 
<hr/> 
Percent: <input data-bind="value: percent()[0]" /> 
Percent: <input data-bind="value: percent()[1]" /> 

ko.bindingHandlers.jqSlider = { 
    init: function(element, valueAccessor, allBindingsAccessor) { 
    //initialize the control 
    var options = allBindingsAccessor().jqOptions || {}; 
    $(element).slider(options); 

    //handle the value changing in the UI 
    ko.utils.registerEventHandler(element, "slide", function() { 
     //would need to do some more work here, if you want to bind against non-observables 
     var observable = valueAccessor(); 
     observable($(element).slider("values")); 
    }); 

    //handle disposal (if KO removes by the template binding) 
    ko.utils.domNodeDisposal.addDisposeCallback(element, function() { 
     $(element).slider("destroy"); 
    }); 
    }, 
    //handle the model value changing 
    update: function(element, valueAccessor) { 
    var value = ko.utils.unwrapObservable(valueAccessor()); 
    $(element).slider("values", value); 
    } 
}; 

var viewModel = { 
    percent: ko.observableArray([10,50]) 
}; 
ko.applyBindings(viewModel) 

回答

2

我只是幫antoher SO用戶採用了滑蓋的,它可以改變這樣做你想做

http://jsfiddle.net/N9uwx/3/

<input data-bind="value: min" /><input data-bind="value: max" /><div data-bind="slider: { min: min, max: max }, sliderOptions: {min: 0, max: 100, step: 1}"></div> 
+0

感謝你的!有用! – Alter