tinymce.render({ elem: "#edit2" , height: 200 }); util.event('lay-event', { getContent:() => { var content = tinymce.get('#edit').getContent() layer.alert(content) }, setContent:() => { tinymce.get('#edit').setContent('点击按钮设置的内容:<span style="color: #e03e2d;">' + new Date()+'</span>') }, clearContent:() => { tinymce.get('#edit').setContent('') }, insertContent:() => { tinymce.get('#edit').insertContent('<b>插入内容</b>') }, getText:() => { var text = tinymce.get('#edit').getContent({format:'text'}) layer.alert(text) }, reload:() => { tinymce.reload({ elem:'#edit' // 所有参数都可以重新设置 ... },(opt) => { //重载完成后回调函数,会把所有参数回传, //重载仅仅重新渲染编辑器,不会清空textarea,可手动清空或设置 tinymce.get('#edit').setContent('') }) }, destroy:()=>{ tinymce.get('#edit').destroy() }, render:()=>{ tinymce.render({elem:'#edit',height:'500px'}) } });
时间: 2024-01-12 07:02:19 浏览: 367
yii2-tinymce-widget:Yii2 的 TinyMCE 所见即所得小部件
这段代码同样使用了 tinymce 编辑器,并将其渲染在 id 为 edit2 的元素上。同时,使用了 layui 的 util 模块监听了名为 lay-event 的事件,并且定义了多个事件回调函数。具体来说,事件回调函数及其作用如下:
- getContent:获取编辑器中的 HTML 内容,并且弹出 layer 提示框显示内容。
- setContent:设置编辑器内容为当前时间,并且弹出 layer 提示框显示设置成功。
- clearContent:清空编辑器中的内容,并且弹出 layer 提示框显示清空成功。
- insertContent:在编辑器中插入一段 HTML 内容,并且弹出 layer 提示框显示插入成功。
- getText:获取编辑器中的纯文本内容,并且弹出 layer 提示框显示内容。
- reload:重新加载编辑器,并且弹出 layer 提示框显示重新加载成功。
- destroy:销毁编辑器,并且弹出 layer 提示框显示销毁成功。
- render:重新渲染编辑器,并且弹出 layer 提示框显示渲染成功。
其中,reload 和 render 方法可以重新渲染编辑器,而其他方法只是对编辑器中的内容进行操作。
阅读全文