問題タブ [rangy]

contenteditable divに数字のハイライトを実装する必要があります（将来的にはより複雑なルールを追加します）。問題は、JavaScriptを置き換えて新しいコンテンツを挿入すると、DOMが変更され、contenteditabledivがフォーカスを失ったことです。私が必要としているのは、現在の位置に注意を払いながらdivに焦点を合わせ続けることです。これにより、ユーザーは問題なく入力でき、私の関数は数字を強調表示するだけです。グーグルで調べてみると、 Rangyライブラリが最善の解決策であると判断しました。私は次のコードを持っています：

問題は、関数の終了後に作業の焦点がdivに戻った後ですが、注意は常にdivの開始を指し、divの開始を除いてどこにでも入力できます。また、次のconsole.logタイプRangy warning: Module SaveRestore: Marker element has been removed. Cannot restore selection. この機能の実装を手伝ってください。怒りっぽいライブラリだけでなく、別の解決策を開いています。ありがとう！

http://jsfiddle.net/2rTA5/これはjsfiddleですが、正しく機能しません（divに数値を入力しても何も起こりません）、おそらく私（jsfiddle経由で初めてコードを投稿する）またはリソースがcontenteditableをサポートしていません。UPD *スタックオーバーフローで同様の問題を読みましたが、解決策は私の場合には適していません:(

HTML ドキュメント内の任意のテキスト範囲に CSS クラスを適用する方法を探しています。私は MooTools と rangy ライブラリを使用していますが、処理する TextNode が 1 つしかない場合は、次のように機能します。

これにより、CSS クラスを適用できる範囲が得られます。ただし、TextArea 内に HTML マークアップがある場合、複数の TextNode が存在するため、一方から始まり他方で終わる範囲を設定する必要があります。textArea 内のすべての TextNodes の順序付けられたリストを取得できれば、これを実行できると思いますが、そのリストを取得する方法 (または場合) がわかりません。

I'm working on a JavaScript wrapper around the Rangy JavaScript plugin. What I'm trying to do: given a jQuery selector and a range, detect if the range is contained within the selector. This is for a space where a user will read a document and be able to make comments about particular sections. So I have a div with id="viewer" that contains the document, and I have an area of buttons that do things after a user selects some text. Here is the (broken) function:

It appears that selectionArea.has(range.startContainer) returns an array of size 0. I have tried wrapping like: $(range.startContainer). Any tips?

I developed a solution for this problem. This assumes you have a div selector and that your content does not have any divs:

「rangy」jQueryプラグイン（1.2ベータ版）の最新バージョンを試して、特定のオフセットでcontenteditable DIVにキャレットを設定しています。

ただし、Firefox では奇妙なエラーで応答します: Security error" code: "1000

問題のあるコードは次のとおりです。

setStart 関数を呼び出すと、コードが失敗します。

だれか rangy の適切な使用例を教えてください。

コンテンツの編集可能なdivがあります。<pre>some code</pre>この中にタグを挿入しています。このタグは、ユーザーがSOと同様にフォーマットされたコードを入力できるように設計されています。

私が抱えている問題は、FFが<br>\ r \ nの代わりにタグを挿入していることです。これは通常のHTMLでは正しいですが、事前に\ r\nが必要です。

contenteditableの親にデリゲートをアタッチしてみました。ただし、これはネストされたdom要素に対しては起動しません。それで

発火しません。また、親divで通常のキーアップを処理し、preタグのすべてのbrを\ r\nに置き換えてみました。しかし、これはカレットを台無しにし、不格好です。

これを行うための好ましい方法はありますか？

サーバー側でそれらを取り除くことに頼らなければならないかもしれませんが、私はむしろしたくありません。

どうもありがとう

したがって、テキストのブロックを含む div があり、以前にユーザーがこのブロック内のテキストを選択し、この選択から範囲オブジェクトを作成しました。選択したテキストの開始点と終了点のオフセットを保存しましたが、範囲を再作成するのに問題があります (操作できるようにするため)。"quotables" は、すべてのテキストを保持する div です。何が間違っているのかわかりません。

しかし、エラーが発生し続けます: Uncaught Error: NOT_FOUND_ERR: DOM Exception 8
m.setStart
(anonymous function)
d.extend._Deferred.f.resolveWith
ddextend.ready
dcaddEventListener.y

私は IE でこの問題に頭を悩ませています。contenteditable 属性が「true」に設定された要素があります。内部にはさまざまな要素があり、その一部は変更できません。テキストは、CSS クラス名「uneditable」を使用してスパンでラップされています。

「keydown」イベントのハンドラーを使用して、セレクションの anchorNode が検査されます。anchorNode が編集不可能な要素の textnode である場合、範囲は変更され、編集不可能な要素ノードの後に​​開始するように設定されます。これは、IE と呼ばれる忌まわしきものを除いて、すべてのブラウザで完全に機能します。

次の例を見てください。

キャレットが編集不可能な要素の最後にある場合、押された文字キーは次のテキスト ノードの先頭に追加されます。しかし IE では、テキストは編集不可能な要素の最後に追加されます。

ハンドラーは次のとおりです。

次の兄弟を選択して range.setStart(nextSibling, 0) を使用しても、IE は編集不可能な要素内に新しいテキストを追加します。IE が編集できない要素を編集しないようにするにはどうすればよいですか?

どんな助けでも大歓迎です。

典型的な wysiwyg エディター html (太字、アンカー、リスト) を含む contenteditable div があります。

現在のカーソルが onKeyDown で、div の最初と最後にあるかどうかを判断する必要があります。この理由は、カーソルの位置と押されたキーに基づいて、この div をバックスペースの前の div とマージするか、Enter で新しい次の div を作成したい場合があるためです。

範囲をいじってきましたが、要素内で html を操作していると、かなり複雑になります。

簡単な解決策を見落としているに違いないと思っています。

これを判断する比較的簡単な方法はありますか - 私は Rangy のようなライブラリを使用することにオープンです。

ありがとう！

編集：私はこれらの行に沿って何かを考えています：

このようなもので奇妙な問題に遭遇するでしょうか?

ここで提案され、ここで例示されているように、rangy ライブラリを使用して、選択したテキストを強調表示できます。

一部のテキストを強調表示したいページに直接アクセスできないため、動的にロードしようとしています:

ただし、 init メソッドを呼び出すと rangy.init(); 、rangy is undefined. このエラーを修正するにはどうすればよいですか?

rangy.cssClassApplierクラスを文字列に適用するにはどうすればよいですか? ありがとう