tinymce是一款功能全面的富文本编辑器,官方主页:http://www.tinymce.com .

主页导航栏 Download提供最新版本的下载,目前最新版本是3.5.x.

1.下载

可以下载的文件有压缩版,支持jquery的版本和带开发源文件的版本(development package)。

其中开发版里面包含了很多例子和未压缩的源码。

下载完代码就可以使用tinymce了。

2.引入tinymce文件

<script type="text/javascript" src="js/tiny_mce/tiny_mce_src.js"></script>

tiny_mce_src.js是未压缩的代码,也可以使用压缩的代码

<script type="text/javascript" src="js/tiny_mce/tiny_mce.js"></script>

3.初始化tinymce

tinyMCE.init({
     mode : "exact",
     elements : "RTEtextarea",
     theme : "advanced",
     plugins : "spellchecker,style,inlinepopups,print,paste,directionality,template", 
     theme_advanced_buttons1 : "fontselect,fontsizeselect,|,forecolor,backcolor,|,bold,italic,underline,|,justifyleft,justifycenter,justifyright,justifyfull,|,bullist,numlist,|,outdent,indent,|,ltr,rtl",
     theme_advanced_buttons2 :"", 
     theme_advanced_buttons3 :"",
     theme_advanced_buttons4 :""

});

注释:mode:是tinymce初始化的方式,可以把页面所有的textarea初始化为富文本编辑器,也可以初始化某个textarea为编辑器,这里采用的是后者

初始化某个指定的textarea为编辑器,这个指定的textarea的id是后面elements 绑定的id。

elements :需要初始化为编辑器的textarea的id.

theme : 初始化tinymce的主题.

这么简单几步就可以使用富文本编辑器了。