关于敲除js的数据绑定和值变化答案

【问题标题】：Regarding data binding by knockout js and value change关于敲除js的数据绑定和值变化
【发布时间】：2013-11-20 16:59:48
【问题描述】：

这里有两个文本框和一个跨度是通过淘汰赛绑定的。我得到的例子很容易理解。这是代码。

<p>First name: <input data-bind="value: firstName" /></p>
<p>Last name: <input data-bind="value: lastName" /></p>
<h2>Hello, <span data-bind="text: fullName"> </span>!</h2>

var ViewModel = function(first, last) {
    this.firstName = ko.observable(first);
    this.lastName = ko.observable(last);

    this.fullName = ko.computed(function() {
        // Knockout tracks dependencies automatically. It knows that fullName depends on firstName and lastName, because these get called when evaluating fullName.
        return this.firstName() + " " + this.lastName();
    }, this);
};

ko.applyBindings(new ViewModel("Planet", "Earth"));

当代码运行时，所传递的任何值都会被反映，但是当我更改一个文本框值时，当keyup 发生时更改的数据不会立即反映，但是当焦点更改时，更改的数据会反映在跨度中。因此，如果我想更改 keyup 上的数据，请指导我，然后我需要更改代码。谢谢

【问题讨论】：

标签： knockout.js

【解决方案1】：

您应该为此使用valueUpdate 绑定：

<p>First name: <input data-bind="value: firstName, valueUpdate: 'keyup'" /></p>
<p>Last name: <input data-bind="value: lastName, valueUpdate: 'keyup'" /></p>
<h2>Hello, <span data-bind="text: fullName"> </span>!</h2>

这里是文档链接：http://knockoutjs.com/documentation/value-binding.html

【讨论】：

【解决方案2】：

您可以在数据绑定中传递一个附加值valueUpdate。

值更新

如果您的绑定还包含一个名为 valueUpdate 的参数，则此定义额外的浏览器事件 KO 应该用来检测变化除了更改事件。以下字符串值是最常用的选择：

"keyup" - 当用户释放一个键时更新你的视图模型

“keypress” - 当用户键入一个键时更新您的视图模型。与 keyup 不同，这会在用户按住某个键时反复更新

"afterkeydown" - 用户一开始就更新你的视图模型键入一个字符。这可以通过捕获浏览器的 keydown 事件来实现并异步处理事件。

在这些选项中，如果您想保留视图模型，“afterkeydown”是最佳选择实时更新。

来自http://knockoutjs.com/documentation/value-binding.html

所以你的绑定是：

<p>First name: <input data-bind="value: firstName, valueUpdate: 'keyup'" /></p>
<p>Last name: <input data-bind="value: lastName, valueUpdate: 'keyup'" /></p>

【讨论】：