`
java_mike
  • 浏览: 85314 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

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",//关联textarea
	theme : "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!效果如附件:
  • 大小: 28.7 KB
分享到:
评论

相关推荐

    22个所见即所得编辑器

    1. TinyMCE:TinyMCE 是一个免费、开源、轻量的所见即所得编辑器,基于 JavaScript,高度可定制,跨平台。它的主要特点是可以高度定制,满足不同用户的需求。 2. FCKEditor:FCKEditor 是一个免费、开源的所见即...

    .Net里面TextBox所见即所得编辑器控件

    为了实现这样的高级编辑功能,开发者通常会转向使用专门的所见即所得编辑器控件。 所见即所得编辑器控件允许用户在界面上直接编辑内容,就像在Word文档中一样,编辑后的效果与最终显示的效果一致。在.NET中,虽然...

    cakephp所见即所得编辑器

    通过以上步骤,你就能在CakePHP项目中成功集成并使用Tinymce所见即所得编辑器了。这将极大地提升用户在编辑内容时的体验,同时也方便开发者管理后台数据。请根据项目需求调整配置,以实现最佳效果。

    基于JavaScript的轻量级所见即所得编辑器TinyMCE设计源码

    该项目是采用TypeScript编写的轻量级所见即所得编辑器TinyMCE的设计源码,集成了3547个TypeScript文件、203个SVG图标文件、150个HTML模板文件、114个LESS样式文件、59个JSON配置文件、51个Markdown文件、47个...

    网页中所见即所得的编辑器

    在网页设计中,所见即所得编辑器极大地简化了非程序员或设计者的网页内容编辑工作。它们通常嵌入到内容管理系统(CMS)中,例如WordPress、Drupal和Joomla,使得内容创作者能够方便地添加文本、图片、链接、表格等...

    tinyMCE-mention:用于 tinyMCE 所见即所得编辑器的 MentionAutocomplete 插件

    提到了 tinyMCE 所见即所得编辑器的插件。 浏览器兼容性 IE7+ Chrome合金 苹果浏览器 火狐 歌剧 依赖关系 注意:如果您使用的是 tinyMCE v3.5.x,请使用 v3.x,如果您使用的是 tinyMCE v4.x,请使用 v4.x 用法 ...

    yii2-tinymce:Yii2扩展,tinymce所见即所得编辑器

    Yii2扩展可简化应用程序中tinymce所见即所得编辑器的使用。 扩展基于Yii 1.1版本: : 提供: 小部件 压气机动作 与文件管理器(如elFinder)集成的存根 ## Installation安装此扩展的首选方法是通过 。 无论运行...

    PDW-Toggle-Toolbars-TinyMCE:TinyMCE所见即所得编辑器的插件。 该插件显示和隐藏工具栏,就像Wordpress中的Kitchen Sink插件一样

    PDW切换工具栏(TinyMCE) TinyMCE所见即所得编辑器的插件。 该插件显示和隐藏工具栏,就像Wordpress中的Kitchen Sink插件一样。 ##安装 $ ( 'textarea#example1' ) . tinymce ( { script_url : "javascript/tiny_...

     FCKeditor是一个专门使用在网页上属于开放源代码的所见即所得文字编辑器

    然而,随着时间的推移,出现了更多类似的编辑器,如TinyMCE、Quill等,它们在某些方面也提供了优秀的编辑体验。 ### 五、FCKeditor的使用与配置 1. **安装**:下载FCKeditor后,解压到服务器目录,按照官方文档...

    md-wysiwyg-editor:“ Markdown所见即所得编辑器”(临时名称)是一个简单的Web富文本格式所见即所得markdown编辑器

    Markdown所见即所得编辑器 “ Markdown WYSIWYG编辑器”(占位符名称)是一个简单的Web RTF / WYSIWYG markdown编辑器,以JavaScript,HTML和CSS编写。 它是由和 ,各种markdown-HTML转换引擎( , 和 )以及新的 ...

    TinyMCE编辑器(HTML编辑器) v4.1.5 中文官方版.zip

    TinyMCE是一个基于浏览器的所见即所得编辑器,平台独立于Web之外,支持目前流行的各种浏览器,由javascript写成。这个编辑器可工作在Mozilla, firefox和MSIE上.很多网站系统都采用了 TinyMCE,其中包括 Wordpress。...

    轻量级网页编辑器所见即所得用鼠标选中文字可看到效果源码下载

    本资源提供的是一款轻量级的所见即所得(WYSIWYG)网页编辑器源码,用户可以通过鼠标选中文字,实时预览编辑效果。 所见即所得的编辑器工作原理是,它模拟了网页在浏览器中的显示方式,用户在编辑界面的操作,如...

    JoomlaFCK for J1.5 所见即所得编辑器 2.6.3.9b 多国语言版

    JoomlaFCK for J1.5是一款专为Joomla 1.5内容管理系统设计的所见即所得(WYSIWYG)编辑器,版本号为2.6.3.9b,且支持多国语言。在网页内容创作过程中,这样的编辑器能提供直观的文本编辑体验,让用户无需了解HTML...

    在线编辑器tinyMCE

    1. **所见即所得(WYSIWYG)**:用户在编辑区域的操作与在传统桌面文字处理软件中类似,所见即所得,极大地提升了在线内容创建的效率和直观性。 2. **丰富的样式和格式支持**:TinyMCE内置了多种文本样式、段落格式...

    TinyMCE(可视化HTML编辑器) v5.0.10.zip

    TinyMCE是一个轻量级的基于浏览器的所见即所得编辑器,支持目前流行的各种浏览器,采用JavaScript/ECMAScript开发,主要特性包括主题/模板支持,多语言支持(包括简体中文),支持通过插件的方式进行扩展。功能配置...

    tinymce富文本编辑器集成demo,添加powerpaste插件,支持word、excel带格式粘贴

    Tinymce是一款强大的WYSIWYG(所见即所得)富文本编辑器,支持多种浏览器,包括Chrome、Firefox、Safari和Internet Explorer。它提供了诸如字体选择、字号调整、颜色设置、图片上传、链接插入等常见的文本编辑功能...

    AngularJS实现所见即所得富文本编辑器源码.zip

    这个"AngularJS实现所见即所得富文本编辑器源码.zip"文件显然包含了使用AngularJS框架开发的富文本编辑器的源代码。 AngularJS的核心特性包括双向数据绑定、依赖注入、模块化和指令系统,这些都为构建富文本编辑器...

    TinyMCE 3.0

    Joomla系统的默认所见即所得编辑器就使用了TinyMCE。 &lt;br&gt;功能特点: &lt;br&gt;两行代码轻松集成 可以通过主题和插件实现自定义 可以自定义XHTNL 1.0输出,屏蔽非法的元素 支持国际语言 多浏览器支持,...

    TinyMCE(可视化HTML编辑器) v5 RC2

    TinyMCE是一个轻量级的基于浏览器的所见即所得编辑器,支持目前流行的各种浏览器,采用JavaScript/ECMAScript开发,主要特性包括主题/模板支持,多语言支持(包括简体中文),支持通过插件的方式进行扩展。功能配置...

    轻量级HTML在线编辑器 tinymce4.1.10

    TinyMCE是一个轻量级的基于浏览器的所见即所得编辑器,由JavaScript写成。它对IE6+和Firefox1.5+都有着非常良好的支持。 功能方面虽然不能称得上是最强,但绝对能够满足大部分网站的需求,并且功能配置灵活简单。另...

Global site tag (gtag.js) - Google Analytics