Question

我试图将Input Range Object与Knockout.js绑定。值绑定似乎运行良好但我无法在拖动滑块时找到更新observable的方法。只有在我释放鼠标时才会更新observable，因为我创建了一个音量滑块，因此给出了糟糕的体验。

我已尝试过每个valueUpdate选项而没有任何结果。它们似乎仅用于文本输入。

＆＃13;

var ViewModel = function() { 
    this.rangeValue = ko.observable(50);
};
 
ko.applyBindings(new ViewModel()); // This makes Knockout get to work

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<input type="text" data-bind="value: rangeValue"/>
<input type="range" data-bind="value: rangeValue, valueUpdate: 'change'"/>

＆＃13;

Answer 1

如this question中所述，您需要在拖动时收听oninput事件以获取新值。

即使没有记录，快速Google搜索也会导致Knockout.js supporting valueUpdate: 'input'。

var ViewModel = function() { 
    this.rangeValue = ko.observable(50);
};
 
ko.applyBindings(new ViewModel()); // This makes Knockout get to work

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<input type="text" data-bind="value: rangeValue"/>
<input type="range" data-bind="value: rangeValue, valueUpdate: 'input'"/>

Knockout.js绑定滑块范围输入

1 个答案: