0

autosuggest 機能を備えた検索ボックスがあるため、検索ボックスの下にある絶対位置の div 内の順序付けられていないリストに候補が追加されます。これらの提案は、JQuery/PHP を使用して ajax 経由で提供されます。

これはすべて正常に機能していますが、1 つの注意点があります。リンクをたどるには、候補の 1 つをマウスで手動でクリックする必要があります。

私が達成したいのは、一番上のオプションが自動的に選択され、矢印キーを使用して上下に移動できるGoogleの提案に似たものです。

誰かが私のためにこのコードを書いてくれるとは思っていませんが、これを行うための最良の方法を簡単な英語で説明しただけです。テキスト入力がフォーカスされたままになる方法と、リスト項目が選択され、Enter キーを押してアクセスできる方法がわかりません。

私が考えたことの1つは、「選択した」アイテムの背景色を他のアイテムとは異なるスタイルにし、そのターゲットURLを別の場所に保存してから、Enterのキープレスをリッスンして、JSを使用して保存されたURLにリダイレクトすることです。

これを行うための最良の方法についての考えをいただければ幸いです。前もって感謝します。

4

1 に答える 1

1

私はこれを一度やったことがあります。次のロジックでコードを書きました。

リスト項目に「フォーカス」を設定する関数を作成しました。この関数は、キー イベントのパラメーターを受け取りました。その中で、キーがupまたはdownであるかどうかを検証しました。はいの場合、リストに下に移動する(下キーの場合)または上に移動する(上キーの場合)イテンスがあるかどうかを確認し、そうであれば変更します。この変更は別の関数によって行われました。変更する項目がない場合は、juts を保持します。

キーがenterの場合、アクション (URL リンク、イベントなど) をアクティブにするだけです。

変更機能はインデックスを受け取るだけで、すべてのアイテムの「選択された」スタイルを消去し、そのスタイルを選択されたアイテムに追加します。検索の開始時に、変更機能を0リストのインデックスに設定するだけです。

これがメインの(ほぼ完成した)プロセスではないかと心配しています。欲しいものはそれだけですか?

于 2013-11-12T19:36:37.287 に答える