私は、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 のテキスト ボックスには押されたキーが表示されず、どのキーが押されたかが記録されません。キーの押下を記録し、同時にリクエストを送信するにはどうすればよいでしょうか。
ベストアンサー1
- クエリが観測可能であることを確認する
- 使用
valueUpdate = 'afterkeydown'
- 使用
event: { 'keyup': check }:
また、可能であればアラートではなく console.log を使用してクエリをログに記録し、値が更新されていることを確認できるようにします。 :) 次のようにイベントをログに記録することもできます。
function check(data, event) {
console.log(event);
}
押したキーのキーコードが表示されます