0

次のような「Weight」の観測可能な配列を含むノックアウトビューモデルがあります

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
});

}

次の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.25を入力したときに、これを1/2秒遅らせるにはどうすればよいですか。 lbs=1およびoz=4？

明確にするために-スピナーを使用しているときに即時更新が行われるようにしたい-しかし、ユーザーがキーパッド/キーボードを介して値を入力している場合は、ユーザー入力を遅らせます。

4

1 に答える 1

2

Throttle'sを使用すると、これを簡単に実現できます。スロットルは、値が指定された時間静止するまで、更新が実際に発生するのを停止します。これが500msスロットルのフィドルです。

コードは次のようになります。

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 });
于 2012-11-21T19:25:34.947 に答える