Simple implementation of WYSIWYG richeditor

The overall idea is as follows:
1. Create an IFRAME;
2. Set designMode to "on" to allow editing;
3. When you click the button (you can change it to an image), Execcommand is used to add tags.
About designMode:
Indicates whether the webpage content can be edited. In IE, it corresponds to document. Body. contenteditable.
The following is a WYSIWYG editor that contains "bold", "italic", and "underline" functions. Of course, it is not actually "rich ", however, we can use a similar approach to add other features. Jquery is used in a few places. In fact, it is not difficult to implement it by yourself.

<Input type = "button" value = "B" onclick = "editor.doc.exe ccommand ('bold ')">
<Input type = "button" value = "I" onclick = "editor.doc.exe ccommand ('italic ')">
<Input type = "button" value = "U" onclick = "editor.doc.exe ccommand ('underline')">

<Br/> Debt Recovery
<IFRAME id = "frame" frameborder = "0" style = "border: 1px solid"> </iframe>
<Br/>
<Input type = "button" value = "get value" onclick = "alert((editor.doc.body).html ()">
 
<SCRIPT type = "text/JavaScript" src = "jquery. js"> </SCRIPT>
<SCRIPT type = "text/JavaScript" src = "editor. js"> </SCRIPT>

Editor. js content:

Editor = {
Init: function (){
VaR Ie = $. browser. MSIE;
Editor.doc = ('{frame'{0}.content}{doc ument;

If (IE ){
Editor.doc. Body. contenteditable = true;
} Else {
Editor.doc. designMode = "on ";
}
} Wind fashion Java-JavaScript mogujie.com women's clothing
};

$ (Function (){
Editor. INIT ();
});