`
kankan1218
  • 浏览: 276852 次
  • 性别: Icon_minigender_1
  • 来自: 大连
社区版块
存档分类
最新评论

从零开始 学习使用TinyMce

阅读更多

1、首先将TinyMCE解压缩,其中docs/目录下是TinyMCE的说明文档,examples/目录下是4个实例页面,而jscripts/目录下则是真正的JS文件。实际使用时候只需要将jscripts/目录上传到服务器上即可。

2、然后在需要使用TinyMCE的页面里加入如下的JS代码:

<!-- tinyMCE -->
<script language="javascript" type="text/javascript"
src="jscripts/tiny_mce/tiny_mce.js"></script>

<script language="javascript" type="text/javascript">
   tinyMCE.init({
        mode : "textareas",
        theme : "advanced",
        language :"zh_cn"
    });
</script>
<!-- /tinyMCE -->

  这里假设页面与jscripts/处于同一目录下,否则请修改代码里的路径。

  现在页面里所有的textarea元素就会被渲染成TinyMCE实例。

3、mode与elements是搭配使用的,用来指定渲染name在elements中的HTML元素为TinyMCE编辑器(可以是DIV或者 Textarea),比如:

  mode : "exact",elements : "example_textarea"[b](example_textarea这个元素被tintMCE渲染)


  也可以单独用 mode : "textareas",这样页面中所有的Textarea元素都会被渲染。[/b]

  theme 可以是advanced或者simple(受功能限制),也可以自定义主题。

  language 常用选择可以是:en,zh_cn,zh_cn_utf8,zh_tw,zh_tw_utf8(和语言包名字对应)

  plugins 用来指定加载相应的插件,以提供特别功能

参考:http://homepage.yesky.com/72/2616072.shtml
分享到:
评论

相关推荐

    vue3中使用tinyMCE

    在Vue3中使用TinyMCE,我们可以利用其强大的功能并结合Vue的新特性,如Composition API和setup语法糖,来实现更加灵活和高效的组件化开发。 首先,我们来看一下如何在Vue3项目中安装和配置TinyMCE。在解压后的文件...

    在vue3项目中使用tinymce编辑器

    本篇文章将详细讲解如何在Vue3项目中引入并使用带有汉化包的TinyMCE编辑器。 首先,你需要从TinyMCE官方网站下载最新版本的编辑器,同时获取到汉化包。TinyMCE支持多种语言,包括中文,你可以从其语言资源包中选择...

    Vue3使用富文本框tinymce

    但是,由于使用了`@tinymce/tinymce-vue`,这些步骤通常是不必要的,因为该库已经包含了TinyMCE的核心文件。 总的来说,Vue3结合TinyMCE提供了一种高效、灵活的富文本编辑解决方案。通过正确配置和使用Vue组件,你...

    tinymce的使用,中文语言包配置

    它支持多种语言,包括中文,因此“tinymce的使用,中文语言包配置”这个标题涉及到的知识点是关于如何在TinyMCE中设置和使用中文语言环境。下面我们将深入探讨TinyMCE的基本概念、安装过程以及中文语言包的配置。 ...

    tinyMCE

    tinyMCE

    tinymce 汉化语言包

    而“tinymce2”的汉化语言包则是为了方便中文用户使用TinyMCE编辑器而特别制作的。 TinyMCE2是TinyMCE的一个较旧版本,这个汉化语言包确保了该版本的编辑器界面完全适应中文环境,使得所有的菜单项、按钮提示和错误...

    tinymce离线资源

    Tinymce 是一款非常流行的开源富文本编辑器,广泛应用于网页内容编辑,尤其在JavaScript项目中被大量使用。它提供了丰富的功能,包括文字格式化、图片上传、链接插入等,使得用户可以像在Word中一样方便地编辑网页...

    完整的tinymce+powerpaste(项目使用中)

    tinymce 官网的一个收费插件powerpaste,此插件目前官网收费每月12美刀,powerpaste放到\tinymce\plugins目录下,在页面引入tinymce.min.js。代码参数配置:tinymce.init({powerpaste_word_import: 'propmt',...

    tinymce本地引入集成demo以及使用版本是5+版本兼容低版本谷歌

    这个"tinymce本地引入集成demo"显然是一份指导如何在本地环境中集成和使用TinyMCE的示例代码,特别强调了其与版本5+的兼容性,同时也考虑到了对较低版本谷歌浏览器的支持。下面我们将深入探讨TinyMCE的关键特性、...

    tinymce 自定义多图片批量上传插件 附使用示范Test

    本文将详细讲解如何为TinyMCE构建一个自定义的多图片批量上传插件,并提供一个使用示范。首先,我们需要理解TinyMCE的插件系统。TinyMCE的插件是由JavaScript编写的小型模块,它们可以插入到编辑器实例中,添加新的...

    TinyMCE 实现本地图片上传

    TinyMCE是一款强大的富文本编辑器,广泛应用于网页和应用程序中,允许用户创建和编辑具有丰富格式的内容。它提供了丰富的API和插件,使得开发者能够定制编辑器功能以满足特定需求。在本教程中,我们将深入探讨如何在...

    TinyMCE

    TinyMCE是一款强大的开源富...总的来说,TinyMCE 3.0是一个功能强大且易于使用的富文本编辑器,适用于各种Web项目,而提供的"tinymce"压缩包则包含了所有必要的文件,帮助开发者快速集成并自定义编辑器以满足特定需求。

    tinymce_powerpaste-master

    TinyMCE PowerPaste是一款强大的富文本编辑器插件,专为TinyMCE 4和5设计,用于优化从Word、Excel或PDF等外部来源粘贴内容的体验。它能够智能地处理格式化文本,消除不必要的样式,保持内容的可读性和一致性。在...

    tinymce-中文包

    tinymce-中文包

    tinymce

    如果你之前使用过TinyFCK,那么迁移到tinymce是一个合理的选择,因为tinymce提供了更丰富的功能和更好的社区支持。 在压缩包文件列表中只有一个名为"tinymce"的文件,这可能是tinymce的安装包或者特定版本的源码。...

    layui的富文本编辑器插件(tinymce)封装

    tinymce的封装主要是为了在Layui框架内无缝使用,提供一个与Layui风格一致的编辑体验。以下是对tinymce在Layui中的封装过程及相关的知识点: 1. **安装与引入**:首先,你需要下载tinymce及其相关依赖,然后将其...

    tinymce powerpaste插件(兼容最新tinymce5.2.0)

    TinyMCE是一个强大的...总的来说,TinyMCE PowerPaste插件通过提供高级的粘贴功能,极大地提升了用户在TinyMCE编辑器中的体验,特别是对于那些经常需要从其他文档应用中复制内容的用户来说,这是一个非常实用的工具。

    TinyMCE自定义上传图片

    TinyMCE是一款强大的所见即所得(WYSIWYG)文本编辑器,广泛应用于网页内容编辑、CMS系统和各种应用程序中。它提供了丰富的API和插件系统,使得开发者可以定制编辑器的功能,以满足特定需求。在这个场景中,我们将...

    TinyMce3.2.1

    这个手册对于初学者来说非常有价值,它详细解释了编辑器的安装、配置、使用方法以及插件开发等技术细节,帮助开发者快速上手并充分利用TinyMCE的所有功能。 总的来说,TinyMCE 3.2.1是一个功能强大、易于定制且安全...

Global site tag (gtag.js) - Google Analytics