Question

我有一个淘汰视图模型，其中包含一个可观察的“权重”数组，如下所示

var Weight = function(item){
var self = this;
self.weight = ko.observable(item);
self.lbs = ko.computed({
    read: function () {
        return Math.floor(self.weight() / ozInLbs);
    },
    write: function (newValue) {
        self.weight((((newValue * ozInLbs) + parseFloat(self.oz())).toFixed(3)*1000)/1000);
    },
    owner: self
});
self.oz =  ko.computed({
    read: function () {
        return ((self.weight() - self.lbs() * ozInLbs).toFixed(3)*1000)/1000;
    },
    write: function (newValue) {
        self.weight(((newValue + (self.lbs() * ozInLbs)).toFixed(3)*1000)/1000);
    },
    owner: self
});

}

w /以下html

<table>
<thead>
    <tr>
        <td>lbs</td>
        <td>oz</td>
    </tr>
</thead>
<tbody data-bind="foreach: weights">
<tr>
    <td><input type="text" data-bind="spinner:lbs" /></td>
    <td><input type="text" data-bind="spinner:oz" /></td>
</tr>

这个想法是，当我增加每秒挥发器的数量时 - 一旦达到16盎司 - 磅增加1，盎司回到零。这适用于以下jsfiddle：http://jsfiddle.net/ajwaka/Ps36B/

现在 - 因为这些本质上是文本输入'我想允许用户添加1.25磅 - 并让它自动更新输入到LBS - 1和OZ = 4

问题是 - 一旦我到达1.2 - 一切都在自动更新，我得到Lbs = 1和Oz = 3.如果用户输入值，我怎么能让它延迟1/2秒1.25我得到lbs = 1和oz = 4？

要清楚 - 我想在使用微调器时保持即时更新 - 但如果用户通过键盘/键盘输入值，则会延迟用户输入。

Answer 1

您可以使用Throttle's轻松实现此目的。节流将停止实际发生的更新，直到该值在指定的时间内处于静止状态。这是your fiddle，节气门500毫秒。

代码如下所示：

self.lbs = ko.computed({
        read: function () {
            return Math.floor(self.weight() / ozInLbs);
        },
        write: function (newValue) {
            self.weight((((newValue * ozInLbs) + parseFloat(self.oz())).toFixed(3)*1000)/1000);
        },
        owner: self
    }).extend({ throttle: 500 });

Knockout BindingHandler＆amp; jquery ui spinner - 延迟用户输入

1 个答案: