敲除得到文本框的旧值

Question

我正在使用地图插件。每当有人从文本框上移开焦点时，我都会发生 on 'blur' 事件。我想知道旧值是否与新值不同。这适用于 "enter" 键。出于某种原因，每当我更改值并按回车键时，我都会第一次获得此控制台输出； 'oldValue | newValue'。然而，当 'blur' 触发时情况并非如此。我得到 'newValue | newValue'

怎么会呢。我怎样才能得到模糊的新旧值？

HTML:

<input class="percent-text" data-bind="text: Percent, value: Percent, event: { keypress: $root.percentUpdate, blur: $root.percentUpdate }" type="number" min="1" max="100" oninput="maxlength(this)" maxlength="3" />

淘汰赛：

    self.percentUpdate = function (data, event) {
        if (event.keyCode === 13 || event.type == 'blur') {
            var $target = $(event.currentTarget);
            console.log(data.Percent() + " | " + event.target.value); 
        }
        return true;
    };

Answer 1

Knockout 在模糊时更新值，并且该值可能在您的模糊事件之前更新。我不知道你到底想做什么，但我会考虑使用 .subscribe 和 .subscribe with beforeChange。

http://knockoutjs.com/documentation/observables.html

例如

data.Percent.subscribe(function(newValue) {
    alert(newValue)
});

和

data.Percent.subscribe(function(oldValue) {
        alert(oldValue)
    }, null, "beforeChange");

Answer 2

你可以用你的方法来做（我有一个成功的测试用例），但正如@AnotherDev 提到的那样，使用内置工具更简单。在 subscribe 函数中，您可以访问值 before 或 after 它被更改，并据此采取行动。如果您希望之后仍然能够检索以前的值，您可以通过缓存前面的值，甚至所有前面的值（在一个数组中）轻松地做到这一点。请注意，在 fiddle 中可以观察到 cachedPercent(s) 的唯一原因是更新 viewModel JSON；在一个真正的应用程序中，我会使用普通数组/数字（和 ev. 在私有变量中）。

在下面的fiddle中进行测试；使用这种方法，ENTER 键函数只需要手动调用 valueHasMutated 来通知订阅函数。

function App(percent) {
  var self = this;
  this.cachedPercent = ko.observable(percent || 0);
  this.cachedPercents = ko.observableArray([percent || 0]);
  this.PercentRaw = ko.observable(percent || 0);
  // Percent stores an integer, and is ratelimited to make sure
  // that the value isn't stored 1000x every time the user increments
  this.Percent = ko.computed(function() { 
    return parseInt(self.PercentRaw()); 
  }).extend({rateLimit: 500});
  this.storePercents = this.Percent.subscribe(function(oldVal) {
    // delete this if clause if you want to manually check somewhere else
    // because this tells JS not to store any value when similar to the previous one
    if (self.cachedPercent() !== oldVal) {
      self.cachedPercent(self.Percent());
      self.cachedPercents.splice(0, 0, self.Percent());
    }
  }, null, 'beforeChange');
}
ko.applyBindings(new App(50));

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>

<input data-bind="value: PercentRaw, 
                  event: {keydown: function(d, e) { if (e.keyCode === 13) PercentRaw.valueHasMutated(); } " type="number" min="1" max="100" maxlength="3" class="percent-text" />

<pre data-bind="text: ko.toJSON($root, null, 2)"></pre>

敲除得到文本框的旧值

knockout get old value of the text box

knockout-mapping-plugin

knockout.js