Ckeditor/fckeditor use CKEditor 3.0.1 quick Use tutorial (with Insert Picture) _ Page Editor

Because the content directly as a string to the editor's Value property assignment using JavaScript code, to let JS code is not subject to the content of double quotes, line change, and so on interference, only first read into the textarea most convenient.

Using CKEditor 3.0.1

Copy Code code as follows:

<textarea cols= "rows=" id= "content" name= "content" >cftea</textarea>
<script type= "Text/javascript" src= "Ckeditor/ckeditor.js" ></script>
<script type= "Text/javascript" >
<!--
Ckeditor.replace ("content");
-->
</script>

It can be seen that the 3.x version of the use of very convenient, do not worry about the formation of two of the same name content. It is also possible to omit the ID of the textarea, because CKEditor first finds it by name, finds it, and then finds it by ID.

And the editor replaces the original textarea in the textarea position.

Set editor skin, width and height

Copy Code code as follows:

<textarea cols= "rows=" id= "content" name= "content" >cftea</textarea>
<script type= "Text/javascript" src= "Ckeditor/ckeditor.js" ></script>
<script type= "Text/javascript" >
<!--
Ckeditor.replace ("Content",
{
Skin: "Kama", width:700, height:300
});
-->
</script>

The skin value should be a folder name under the Ckeditor/skins folder, and the editor will not appear if you point to a nonexistent skin.

Setting values, taking values

Setting values

CKEDITOR.instances.content.setData ("cloud-dwelling community"); Content is the first parameter value of the previous Ckeditor.replace
Or

Copy Code code as follows:

var editor = ckeditor.replace ("content");
Editor.setdata ("cloud-dwelling community");

Take value

Alert (CKEDITOR.instances.content.getData ()); Content is the first parameter value of the previous Ckeditor.replace
Or

var editor = ckeditor.replace ("content");
Alert (Editor.getdata ());
Insert Picture

To demonstrate this example, it is best to put it in the button's event handler for some delay.

CKEDITOR.instances.content.insertHtml ("<img src=...>");