首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

TinyMCE所见即所得编辑器运用

2012-11-23 
TinyMCE所见即所得编辑器使用TinyMCE是一个轻量级的基于浏览器的所见即所得编辑器,由JavaScript写成。它对I

TinyMCE所见即所得编辑器使用
    TinyMCE是一个轻量级的基于浏览器的所见即所得编辑器,由JavaScript写成。它对IE6+和Firefox1.5+都有着非常良好的支持。功能方面虽然不能称得上是最强,但绝对能够满足大部分网站的需求,并且功能配置灵活简单。另一特点是加载速度非常快,如果你的服务器采用的脚本语言是 PHP,那还可以进一步优化。最重要的是,TinyMCE是一个根据LGPL license发布的自由软件,你可以把它用于商业应用。

    使用步骤:

1、从官网下载TinyMCE。

2、在页面中引入:
<script type="text/javascript" src="/js/jscripts/tiny_mce/tiny_mce.js"></script>

3、添加TinyMCE初始化js代码:

<script language="javascript" type="text/javascript">tinyMCE.init({language : "zh_cn",mode : "textareas",//关联textareatheme : "advanced",//width : "500",plugins : "table,save,advhr,advimage,advlink,emotions,iespell,insertdatetime,preview,zoom,flash,searchreplace,print,contextmenu",theme_advanced_buttons1_add_before : "save,separator",theme_advanced_buttons1_add : "fontselect,fontsizeselect",theme_advanced_buttons2_add : "separator,insertdate,inserttime,preview,zoom,separator,forecolor,backcolor",theme_advanced_buttons2_add_before: "cut,copy,paste,separator,search,replace,separator",theme_advanced_buttons3_add_before : "tablecontrols,separator",theme_advanced_buttons3_add : "emotions,iespell,flash,advhr,separator,print",theme_advanced_toolbar_location : "top",theme_advanced_toolbar_align : "left",theme_advanced_path_location : "bottom",plugin_insertdate_dateFormat : "%Y-%m-%d",plugin_insertdate_timeFormat : "%H:%M:%S",extended_valid_elements : "a[name|href|target|title|onclick],img[class|src|border=0|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name],hr[class|width|size|noshade],font[face|size|color|style],span[class|align|style]",external_link_list_url : "example_data/example_link_list.js",external_image_list_url : "example_data/example_image_list.js",flash_external_list_url : "example_data/example_flash_list.js"}); </script>

4、页面文本域:<textarea name="content" rows="23" cols="80"></textarea>

5、Ok!效果如附件:

热点排行