32

我正在尝试读取 html 文本框的内容并从 API 获取数据以完成 google 样式的自动完成。我正在使用twitter bootstrap typeahead自动完成功能。为此,我需要在按键被按下时记录它们并使用查询文本进行 API 调用。

文本框的 html 是这样的

<input id="query" data-bind="value: query, valueUpdate: 'keypress', event: { keypress: check }"/>

我的假设是,一旦按下键,这将更新视图模型中的值,同时该check函数将调用 API。但是调用 check() 并且当用户键入时文本框永远不会被填充。如果 JS 看起来像这样 -

function check() {
    alert("Hello");     
    }

对于我按下的每个键,都会弹出 hello,但 HTML UI 中的文本框不显示按下的键/不记录按下的键。如何记录按键并同时发送请求?

4

2 回答 2

45
  1. 确保查询是可观察的
  2. 利用valueUpdate = 'afterkeydown'
  3. 利用event: { 'keyup': check }:

此外,如果可能,我会使用 console.log 而不是警报,并记录查询,以便确保值正在更新。:) 你也想像这样记录事件

function check(data, event) {
    console.log(event);
}

这会告诉你你按下的键的键码

于 2013-09-19T14:38:34.187 回答
32

这个线程很旧,但我注意到它没有引用 KO 的textInput绑定。这是 v3.2.0 中添加的新功能。

至少到目前为止(2015 年 1 月),KO 文档专门解决了这个问题:

注 1:textInput 与值绑定

尽管值绑定也可以在文本框和视图模型属性之间执行双向绑定,但是当您想要立即实时更新时,您应该更喜欢 textInput。

请参阅http://knockoutjs.com/documentation/textinput-binding.html

于 2015-01-17T21:01:20.423 回答