JavaScriptでIntelliSense /オートコンプリートを構築する

Question

私は現在、独自のマークアップ言語を実装したフォーラムWebサイトにいくつかの機能を追加するFirefoxのアドオンを維持しています。

このアドオン用のIntelliSense関数をビルドしました。このアドオンは、Visual Studioと同様に、このマークアップをテキストエリアに入力するときに自動的にポップアップ表示されます。例：

http://members.lycos.co.uk/suffusion/namfox/faq-1.5/autocomplete-example-2-1.jpg

実装について一番難しい事は私がポップアップすることができ、それに非常に近いのIntelliSenseウィンドウをテキストエリアでキーを押しての（x、y）の座標を見つけることです。 JavaScriptのkeypressイベントはこれらの座標を公開しないので、私はこれを回避する必要がありました。残念ながら、私はx座標ではなくy座標を取得するクロスブラウザー互換の方法しか見つけられませんでした。このコードは_getPopupPoint関数のhereにあります。

私はMozillaのXPCOMインターフェイスを使用して座標を取得しているので、Firefoxで動作します。だからこれはFirefoxで動作しますが、アドオンをGoogle Chromeに移植したいので、座標を取得する方法が見つかりませんでした。

だから私が求めているのは2倍です： （1）キープレスのx座標を得る良い方法はありますか？ （2）そうでない場合は、同じデータを取得するためにGoogle Chromeアドオンのコンテキストでできることはありますか？

Answer 1

これは、event object in DOJO toolkitの実装をチェックアウトするのに面白いかもしれません。

道場は、イベントオブジェクトと、次の属性提供：

• event.target - イベントを生成した要素
• event.currentTarget - 現在のターゲット
• event.layerX - X座標event.currentTargetを基準にした相対座標です。
• event.layerY - event.currentTargetを基準にしたy座標
• event.pageX - ビューポートに相対するx座標
• event.pageY - y座標、ビューポート
• event.relatedTargetに対して - キー押下イベントの場合 - のonmouseoverとれるonmouseoutために、マウスポインタがevent.charCode
• のに又は外に移動しているオブジェクト、キーの文字コードが押された
• event.keyCode - キー押下イベントの場合は、ENTERやスペースバーなどの特殊キーを処理します。
• event.charOrCode - 正規化されたcharCodeとkeyCodeで、アルファキーと特殊キーの直接比較に使用できます。 （1.1で追加）

Answer 2

window.getSelectionと関連する方法が、あなたが探しているものかもしれません。オフセットなどの関数を使用して、キャレットの画面位置を計算できます。