在淘汰JS中使用keypress事件

Question

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

文本框的html是这样的

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

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

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

对于我按下的每个键,你好弹出,但是HTML UI中的文本框没有显示按下的键/不记录按下了哪个键.如何记录按键并同时发送请求？

Answer 1

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

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

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

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

Answer 2

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

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

注1:textInput与值绑定

虽然值绑定也可以在文本框和viewmodel属性之间执行双向绑定,但是只要您想要立即进行实时更新,就应该首选textInput.

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