2

假设我有以下链接到文本框的 jQuery UI 滑块。

是否可以允许用户在文本框中输入大于滑块值的值（并将滑块设置为最大值）？

ko.bindingHandlers.slider = {
init: function (element, valueAccessor, allBindingsAccessor) {
var options = allBindingsAccessor().sliderOptions || {};
$(element).slider(options);
ko.utils.registerEventHandler(element, "slidechange", function (event, ui) {
    var observable = valueAccessor();
    observable(ui.value);
});
ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
    $(element).slider("destroy");
});
ko.utils.registerEventHandler(element, "slide", function (event, ui) {
    var observable = valueAccessor();
    observable(ui.value);
});
},
update: function (element, valueAccessor) {
var value = ko.utils.unwrapObservable(valueAccessor());
if (isNaN(value)) value = 0;
$(element).slider("value", value);
}
};

在此示例中：http: //jsfiddle.net/jearles/Dt7Ka/12/我希望能够在文本框中保存超过 100 的值，并使滑块出现在它们的最大值处。

4

2 回答 2

3

slidechange如果 observable 的值小于然后，您可以只更新事件中的 observable 值options.max：

ko.utils.registerEventHandler(element, "slidechange", function (event, ui) {
    var observable = valueAccessor();
    var currentMax = $(element).slider("option", "max"); 
    if (observable() <= currentMax)
         observable(ui.value);
});

JSFiddle 演示。

于 2012-10-29T12:33:51.213 回答
0

将此行放在以下行之后：if (isNaN(value)) value = 0; 在绑定更新函数

if(value>100){
    $(element).slider("option","max",value);          
}

例子：

http://jsfiddle.net/Razaz/Qy6jR/4/

如果值大于 100，它将滑块的最大值更改为在文本框中输入的新值

问候。

于 2012-10-29T12:35:40.277 回答