シンプルなオンライン ドキュメント エディターを構築しています。このエディターでは、テキストを複数のページに分割し、各ページを contenteditable div にします。
これを行うための基本的なアルゴリズムを考え出しました。WORDS_PER_PAGE
基本的に、現在フォーカスされている div をチェックして、定数よりも多くの単語があるかどうかを確認します。その場合は、このページの最後の単語を取得して、次のページの先頭に配置します。次に、ページの終わりに到達するまで、次のページ、次のページなどで同じチェックを実行します。押されているキーが削除/バックスペース キーである場合、同様のチェックが実行されます。
現在、このアルゴリズムは完全ではありません (各ページは単語の長さに応じて可変の高さになります) が、私のニーズにはぴったりです。本当に私を悩ませているのは、カーソル位置を設定し、これらの編集可能な div のカーソル位置を取得することです。私が欲しいのはgetCursor (element)
、カーソルがオフセットされている文字数を返し、setCursor (element, n)
カーソルを n 文字のオフセットに設定する関数だけです。
私は IE < 9 についてがらくたを与えないので、おかしな回避策は必要ありません。また、Rangy ライブラリやその他のライブラリを使用することもできません。Range オブジェクトと Selection オブジェクトをいじってみましたが、うまくいきません。この問題にどのように取り組むべきかについて、誰かアイデアや提案はありますか?