1

Gmail/Google ドキュメントのリッチテキスト WYSIWYG edtior で「リンクの変更/削除」のようなものを実装しようとしています。URL を入力すると、その下に「Goto Link、Change、Remote」と表示される div が表示されます。

jQueryを使用してそのようなものをどのように書くことができますか?

  1. カーソルの行と列を取得するには?
  2. フォントの幅と高さを計算するにはどうすればよいですか (特に、太字/斜体スタイルの非固定幅フォント)
  3. DIV が単語の先頭に表示されるようにするにはどうすればよいですか?

前もって感謝します!

4

2 に答える 2

6

回答: http://jsfiddle.net/morrison/57BR3/

機能:

  • ハイパーリンクの近くに配置された div を作成します。
  • Google ドキュメント ボックスのように見えます。
  • テキストと URL を変更する機能。
  • 削除が実装されました。

しないこと:

  • テキストエリアで作業します。テキストエリアはプレーンテキストであるため、html をサポートしていません。これは、回避するための複雑なプロセスです。ライブラリを見つけて、私の答えを実装してください。
  • 矢印キーでカーソルをその上に移動すると開きます。上記の理由で動作しません。
于 2011-04-22T08:42:24.193 に答える
0

あなたは、WYSIWYG エディターを構築していることを示唆しています。本当にテキストエリアを使用しますか? テキストエリアは HTML をサポートしていません。後のコメントに答えるには、テキスト領域内のキャレットの (x, y) 位置を取得する最良の方法は、textarea-caret-position プラグインを使用することです。

于 2014-03-17T13:00:48.327 に答える