First of all, there must be an editing box. This editing box is actually an editable web page. We use an iframe to create an editing box.
<IFRAME id=“HtmlEdit” style="WIDTH: 100%; HEIGHT: 296px" marginWidth=“0” marginHeight=“0”></IFRAME>
And add javascript code to specify that HtmlEdit has editing function:
<script language="javascript">
var editor;
editor = ("HtmlEdit").contentWindow;
//Just type the following settings, and the iframe becomes an editor immediately.
= 'On';
= true;
//But IE is a little different from FireFox. In order to be compatible with FireFox, a new document must be created.
();
('<html><body></body></html>');
();
//Font special effects - Bolding method 1
function addBold()
{
();
//All font effects can be completed just by using execComman().
("Bold", false, null);
}
//Font special effects - Bolding method 2
function addBold()
{
();
//Get selected focus
var sel = ();
insertHTML("<b>"++"</b>");
}
function insertHTML(html)
{
if (() != "none")
{
() ;
}
().pasteHTML(html) ;
}
</script>
WEB online editor principle
Reprinted from: /?id=239
From eWebEditor to FCKeditor, there are many online editors, which are very powerful and many, but the basic principles are very simple
The editors I found mainly have 3 major categories. I will summarize them and write down their respective advantages and disadvantages.
Use the textarea tag directly
Advantages: fast speed, easy to submit, and you can use UBB tags to make up for what you can't see and get
Disadvantages: Not intuitive, very few functions
Use the DIV or TABLE's CONTENTEDITABLE tag, attribute to make an area editable
Advantages: It can be very intuitive and can achieve various effects
Disadvantages: This tag is not available under mozilla, it is only suitable for IE browser, and has high requirements for js
Use the document ="On" in the iframe or frame to achieve editable
Advantages: It has all the advantages of the second item above, and it also supports multiple browsers such as FF.
Disadvantages: High requirements for js
Below is a simple example code for point three