2017年8月5日(土)
HTML5 Editor for PC の総まとめ #HTML5&CSS3&JavaScript

【Mozilla Firefox, Google Chrome, Safari, Opera】
・ほぼ同じように、ご利用いただけます。
・CSSに完全対応。

【Microsoft Edge】
・CSSに未対応の部分があります。

【IE11】
・CSSに未対応の部分があります。
・[enter]では、<p></p>段落改行になります。
・[shift]+[enter]で、<br>改行になります。
・Charactorsの文字挿入機能は、ご利用いただけません。


P.S. Network Communication Note『子猫の手 Ver.3（三毛）』およびその他のシステムに、このエディタ機能を付加します。お楽しみに。


P.S.2 改行タグを<br>に統一したのですが、左寄せ、中央揃え、右寄せした行で改行すると、<br>だけが挿入されるのではなく、新たに<div></div>囲いが発生して、一行余分に改行してしまうバグを確認しました。

　insertBrOnReturnがサポートされているFirefoxでは、上手に<br>だけ挿入されています。いろいろ検討しましたが、<br>を挿入した時点で、自動的に<div></div>囲いが発生することが分かり、どうしようもありません。今回は、改行を<br>で統一することは諦めて、insertBrOnReturnがサポートされるのを待つことにします。


P.S.2-2 dispatchEvent()を使って、[enter]を[shift]+[enter]に出来るようでしたが、上手くいきません。きっと、document.createEvent("Event")で記述のあった当時は機能したのでしょう。

--
(1)仮のイベントオブジェクトを作成します。
$event=document.createEvent("KeyboardEvent");

(2)パラメーターを設定します。
$event.initKeyboardEvent("keypress",true,true,・・・);

　このメソッドは不確定要素ということで、各ブラウザごとに仕様が異なっていました。

　この部分を研究しましたが、どうしてもkeyCodeに相当するパラメーターを探し当てれません。

　なお、個別では設定できませんでした。おそらく、readonlyですね。
×$event.keyCode=13;
×$event.shiftKey=true;

(3)現在のイベントに上書きします。
document.dispatchEvent($event);

　この戻り値がtrueなので、上書きは有効なのでしょう。
--

　丸一日、費やしました。あと一息なのですが、他の仕事に取り掛からないいけないので、ここまでです。残念。
http://neconote.jp/prg/editor_pc.html