1

私は、mobwriteを使用して、テキストエリアを複数の人が編集できるようにすることに取り組んでいます。mobwriteは、動作にdiff-match-patchを使用します。さまざまな人の間でテキストエリアを同期するのに適しています。さて、私が欲しかったのは、さまざまなユーザーからのパッチをさまざまな色で強調表示することでした。

これを行うには、テキストエリアの「テキストの範囲」をどうにかして色付けする必要がありますか?(もちろん、textarea自体を直接編集する必要はありません!)

codemirrorとeditareaの2つの構文ハイライターについてはすでに読みました。「テキストの範囲」の開始と終了を取得するための便利な機能があります。しかし、多くの不要なjavascriptコードをロードせずに、この選択範囲を色付けする方法を見つけることができませんでした。

「テキストエリア内のテキストの範囲の色付け」を実現する方法を提案してください。ありがとうございました。

4

1 に答える 1

0

私が知っている 1 つの方法は、テキストエリアの不透明度を 0 に設定し、その後ろに div を配置することです。幅/高さ/位置/テキストサイズなどは同じでなければなりません。次に、すべての入力をテキストエリアから div に送信するだけです。それが完了すると、選択したテキスト範囲を取得する JavaScript 関数を開始するボタンをページに配置し、それに基づいて div を変更できるようになります。

これに関する 1 つの問題は、テキストが強調表示されているのがユーザーに表示されないため、エミュレートする必要があることです。


これで始められるはずです:

<textarea onKeyDown="document.getElementById('ta_disp').innerHTML = this.value;" style="z-index: 100; position: absolute; left: 0; top: 0; width: 300px; height: 100px; opacity: 0;-moz-opacity: 0;filter: alpha(opacity=0); outline: 1px solid #f00;"></textarea>
<div id="ta_disp" style="z-index: 99; position: absolute; left: 0; top: 0; width: 300px; height: 100px; outline: 1px solid #f00;"></div>
于 2012-03-16T11:46:07.187 に答える