How to use the jquery editor plugin tinyMCE

Modify the simplified file size and download the example: Download the file to your local computer. You can also download the latest jQuery-based code from the official website: https://www.jb51.net/codes/44180.html

1 html

<textarea id="txtcontent" runat="server" name="elm1" rows="15" cols="80" style="width:80%"></textarea>

2 js reference

First reference tiny_mce.js and jquery-1.4.2.min.js

Calling tinyMCE:

Parameter details:

mode: textareas or exact
elements: used with exact in mode, its value is the id or name of the textarea to be used in HTML
theme: The style used
Skin: Find the style in the corresponding skin directory
skin_variant: The css file selected in the skin directory, such as: skin_variant: "black" means: skins\o2k7\ui_black.css
plugins: Select and use plugins in the plugins folder
theme_advanced_buttons1: The first row of function buttons is displayed, and so on theme_advanced_buttons2 and so on
3. Add an image to the input box through js and display it. The js code is as follows:
tinyMCE.execCommand('mceInsertContent',false,"<p><img src=\"../images/house.jpg\" alt=\"\" width=\"588\" height=\"419\" /></p>");
Get the content of the input box through js, the code is as follows:
tinyMCE.getInstanceById('txtcontent').getBody().innerHTML