Ale*_*nor 27 javascript data-binding knockout.js
我注意到我无法获得一些工作中的Knockout实时教程或应该演示可观察数据绑定的基本示例.
这是我的代码:
<!DOCTYPE html>
<html lang="en">
<html>
<head>
<meta charset="utf-8" />
<title>Testing</title>
<script type="text/javascript" src="knockout.js"></script>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
function TestViewModel() {
this.Name = ko.observable("Testing");
}
$(function() {
ko.applyBindings(new TestViewModel());
});
</script>
</head>
<body>
<h1>Testing Knockout.js</h1>
<div>
<div>
<span data-bind="text: Name"></span>
</div>
<div>
<input type="text" data-bind="value: Name"></input>
</div>
</div>
</body>
</html>
因此,当我在谷歌浏览器或Firefox中打开它时,我希望在更改输入中的文本时,span标记的值会发生变化,但事实并非如此.有人可以解释为什么以上不起作用？(此代码几乎是从网站上的文档中复制的)
谢谢,亚历克斯.
nem*_*esv 58
从KO版本3.2开始(如Salvador Dali回答指出),您应该使用textinput绑定进行即时更新:
<input data-bind="textInput: userName" />
在您使用较早的Knockout版本和value绑定时,您应该进行以下更改:
默认情况下,knockout会更新change事件上的observable值(例如,当文本框的焦点丢失时).
如果你想即时更新你需要指定valueUpdate其中的可能事件选项:keyup,keypress,afterkeydown看到的更多信息的文档.
所以改变你的value绑定:
<input type="text" data-bind="value: Name, valueUpdate: 'afterkeydown'"></input>
演示JSFiddle.
Sal*_*ali 20
接受的答案是正确的,但在新的KO版本3.2中,他们添加了textinput绑定.所以不用value绑定你可以使用textInput:
<input data-bind="textInput: userName" />
它做了两件重要的事情:
| 归档时间： |
|
| 查看次数： |
29450 次 |
| 最近记录： |