富文本编辑器小技巧大杂烩之TinyMce

TinyMce富文本编辑器问题点总结

由于是第一次接触富文本编辑器，走过不少歪路，在这里另起一篇特别记录：

问题一、如何获取编辑器内容和回显编辑器

获取编辑器的内容：

 var content = tinymce.get('myTextarea').getContent();

解析： myTextarea是编辑器的id
将数据回显到编辑器：

 $("#myTextarea").val('content')

解析： #myTextarea 是你创建的容器的id属性值
如果回显到其他普通的标签，也是一样的做法，直接赋值就好，因为从编辑器获取的本来就是完整的html。

问题二、如何给编辑器外框加上红色边框

使用场景： 当我们需要给编辑器加上校验时，校验不通过的话，需要显示红色外框，以提示用户重新输入。
从前端出发，解释如何添加。（这里提一嘴，我们目前使用的是tinyMce的经典模式，编辑器其实是在创建的容器下方插入一个div，里面包括一个全新的页面）。
从页面我们可以知道想要在外边框加上红色边框，就需要找到tinyForm的第二个子元素，js如下：

$("#tinyForm").children(":eq(1)").css('border','1px solid red');

前端渲染图：

效果图： 编辑器外边框加上了红色边框，也就起到警醒用户的作用，当然，加其他样式就随你了。

问题三： 如何和谐去掉编辑器下方的广告

首先来了解下编辑器下方的状态栏，分别由记录状态、官网地址和可拖曳按钮。