javascript - テキスト ボックスにテキストを入力するときに、ハイパーリンクされた「ハッシュタグ」を作成しようとしています

Question

ユーザーがテキストを投稿する Web サイトを作成しています。「投稿」ページのテキスト ボックスの 1 つは、タグ/ハッシュタグ用です。ユーザーはこのテキストボックスに「#food」または「food」と入力しますが、スペースバーを押すとすぐに、入力された単語のそれぞれにハイパーリンクを設定したいと思います....投稿後、他のユーザーがクリックできるハイパーリンク付きのタグとして投稿。

すなわち。この質問を投稿しているので、stackoverflow の「タグ」ボックスと同じように。

テキストボックスをこれに対応させる方法を知っている人はいますか?

Answer 1

そのためにインラインオブジェクトを使用しないでください。代わりに、編集可能な div を使用してください。

<div id="myInputBox" contenteditable="true"></div>

ブロックタイプの入力ボックスを作成することもできますが、タグ内に複雑なマークアップを挿入するルールをすべてのブラウザーが順守するかどうかはわかりません。