2

テキストボックスにリンクされている次のjQueryUIスライダーがあるとします。

ユーザーがスライダーの値よりも大きい値をテキストボックスに入力できるようにする（そしてスライダーを最大に設定する）ことは可能ですか？

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オブザーバブルの値が以下の場合にのみ、イベントのオブザーバブル値を更新することで実行できます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 に答える