はじめに カスタムの Wysiwyg / リッチ テキスト エディター (RTE) を作成しています。
私は見ました:
- CKEditor
- TinyMCE
- など
Textarea
と Iframe があります。Textarea は、データベースからの情報を保持します。Textarea$(window).load (function () {で非表示になり、その内容が で Iframe にコピーされdesignMode = "on";ます。
改行
'Enter' を押したときの改行を除いて、すべてうまく機能します。すべてのブラウザで結果は異なります:
- <p>: Opera & IE
- <div>: Safari & Chrome
- <br>: Firefox
これは確固たる結果ではないので、誰かが Enter を押したときに<br>必ず配置する必要があると判断しました。そのため、誰かが新しい段落が必要な場合、Enter キーを 2 回押して 2 つ<br>配置します。
そのため、keyCode 13 (Enter) を使用して KeyDown イベントを作成します。
関数内で、次のデフォルト アクションを防止しました:
- event.preventDefault ();IE9+、FF、CHROME、SAFARI AND OPERA
- event.returnValue = false;IE8-
そして、カスタムを追加するためのコードを挿入しました<br>：
- pasteHTMLIE
- insertHTMLFF、CHROME、SAFARI AND OPERA
JSFiddle
上記のコードは両方とも、IE7/8/9、Firefox、Chrome、Opera、および Safari で動作しますが、奇妙な結果が表示されます。自分でバグを確認するために、ここに JSFiddle を作成しました: http://jsfiddle.net/RickS/RZ4Re/
The bugs 上記の JSFiddle を参照してください
[1: すべてのブラウザへの影響] 'Two' の後に 'Enter' を押しても何も起こりませんが、'One' の後に 'Enter' を押すと、コードが機能することがわかります。orのようなブロック要素の前にカーソルを置くと、配置されないことがわかりました。
バグはインライン要素には表示されません。
望ましい結果:ブロック要素の前に a を配置します。<ul> <ol><p><br><br>
[2: IE7/8/9 での影響] 'Three' (リスト項目) の後に 'Enter' を押すと、'Four' が消えます。何かを入力して、もう一度「Enter」を押します。これで「5」が消えます。
そして奇妙な部分: 「One」という単語をクリックします。'4' と '5' が再び表示され、削除されることはありませんでした。望ましい結果: 別のリスト項目を作成すると、リストの下のコンテンツが表示されたままになります。
この問題を
1 週間以上調べましたが、どこにも解決策が見つからないようです。
スタック オーバーフローでは、この記事に近づいたと思いますが、私の質問は解決しませんでした。
ソリューションは、IE9 (可能であれば 7 と 8 も)、Firefox、Chrome、Safari、Opera のクロスブラウザーで動作する必要があります。
誰かがこの質問で私を助けてくれることを願っています。
前もって: どうもありがとうございました!
リック