ewebeditor网页文本编辑器、图片回显、弹窗自动关闭并刷新父页面

做了一个模块，在一个弹窗中使用ewebeditor编辑器，在使用的过程中遇到的一些坑：
一、没引入ewebeditor编辑器，页面出不来
1、在项目中导入ewebeditor编辑器

2、在需要编辑器的页面引入

<td style="height: 300px"><textarea id="diary_wdcontent" name="wdcontent" style="display:none">${mydiaryDto.wdcontent}</textarea><IFRAME id="ewebeditor_wdcontent" src="/ewebeditor/ewebeditor.htm?id=diary_wdcontent&style=coolblue&originalfilename=contentfileurl_orifilename&savefilename=contentfileurl_savefilename&savepathfilename=contentfileurl" frameborder="0" scrolling    ="no" width="100%" height="360"></IFRAME><table style="display:none;"><tr><td>参数：originalfilename</td><td><input type="text" id="contentfileurl_orifilename" name="contentfileurl_orifilename"></td></tr><tr><td>参数：savefilename</td><td><input type="text" id="contentfileurl_savefilename" name="contentfileurl_savefilename"></td></tr><tr><td>参数：savepathfilename</td><td><input type="text" id="contentfileurl" name="contentfileurl" value="${mydiaryDto.contentfileurl}"></td></tr></table></td>

二、ewebeditor编辑器添加图片的弹窗显示到最底层
1、因为这个编辑器是在弹窗中镶嵌的，在ewebeditor编辑器添加图片的时候，添加图片的弹窗出现在父弹框的下面
2、解决办法：在打开添加图片的父弹框的时候给弹框加一个属性zIndex

三、添加图片后，图片回显问题
1、因为是ewebeditor编辑器，编辑器中可以是文字也可以是图片，在取出值显示的时候需要判断是图片还是文字

templet : function(d) {                      if(d.wdcontent.indexOf("src") != -1){       //图片的值会包含一个src的属性，利用这个属性判断               return d.wdcontent; //如果是图片直接返回}else{//如果不是图片，将文字输入，利用ewebeditor编辑器存的文字会有一些标签，取出的时候需要将标签去掉value = delHtmlTag(d.wdcontent);                         if(value.length > 20){return value.substring(0, 20)+"...";                       }else{return value;}}                                               }

四、在弹窗中点击保存，自动关闭弹窗和刷新父页面，代码如下

success : function(result) {parent.$.messager.progress('close');result = $.parseJSON(result);if (result.success) {var index = parent.layer.getFrameIndex(window.name); //获取窗口索引  parent.layer.close(index); //关闭窗口//刷新父页             parent.window.location.href =rootPath + '/xxx/xxx.jspx?xxx='+result.xxx; //这里跟的是父页面的路径，后面跟的参数可跟可不跟layer.msg(result.msg);} else {layer.msg(result.msg);}

ewebeditor网页文本编辑器、图片回显、弹窗自动关闭并刷新父页面相关推荐

富文本编辑器wangEditor回显问题
回显时渲染dom报错问题: 富文本编辑器在回显html时偶尔会报以下错误: Error in v-on handler: "Error: Cannot find a descendant a ...
layui富文本编辑器上传图片java_解决layui富文本编辑器图片上传无法回显的问题...
layui富文本编辑器用起来挺方便的,但是不足的是不提供图片上传的接口,需要自己写上传接口,而且返回的数据类型要符合layui富文本编辑器图片上传插件的要求,否则图片可以上传成功,但是无法回显,这个问 ...
layui富文本编辑器图片上传无法回显问题解决
layui富文本编辑器用起来挺方便的,但是不足的是不提供图片上传的接口,需要自己写上传接口,而且返回的数据类型要符合layui富文本编辑器图片上传插件的要求,否则图片可以上传成功,但是无法回显,这个问 ...
java 图片回显_java实现Simditor图片上传七牛云并回显
首先呢,我们有这样一个需求: 当图片上传Simditor时,将其保存到七牛云上,然后并回显在我们的Simditor中. 首先,需要我们有一个七牛云帐号,并且配置Simditor富文本编辑器. 其次,我 ...
java图片上传及图片回显1
目的:选择图片,进行图片回显之后将图片保存到服务器上(PS:没有使用任何插件,样式很丑) 实现方式: js+servlet+jsp的方式来实现事先准备: 文件上传处理在浏览器中是以流的形式提交到服务 ...
几种常用网页文本编辑器总结
原文地址: 几种常用网页文本编辑器总结作者: 浪迹天涯无忧少年文本编辑器应用总结一． lhgeditor文本编辑器 lhgeditor组件文件结构: 1. lhgeditor.js: 组件的核心 ...
【.net】Ueditor中图片上传和图片回显路径的设置
在csdn六百多天的游侠今日现身江湖. 问题发生的背景: 所有项目代码中,图片上传都是固定存到一个图片专属的盘符,这样就可以整个盘符对所有图片进行备份以防丢失. 但是!有一个站点所引用的百度编辑器(主 ...
【SpringBoot】简单的文件上传和文件下载以及图片回显
介绍这里是小编成长之路的历程,也是小编的学习之路.希望和各位大佬们一起成长! 以下为小编最喜欢的两句话: 要有最朴素的生活和最遥远的梦想,即使明天天寒地冻,山高水远,路远马亡. 一个人为什么要努力? ...
富文本编辑器图片上传失败的BUG解决：IndexError：list index out of range
富文本编辑器图片上传失败的BUG解决问题原因我们将通过Django上传的图片保存到了FastDFS中,而保存在FastDFS中的文件名没有后缀名(.png/.jpg/.jif),而ckeditor ...
el-upload 上传图片、编辑时图片回显以及后续提交问题
功能描述: 添加图片上传成功在表格内显示该图片点击编辑,打开上传图片对话框,图片回显(与添加共用同一个对话框) html代码:(具体添加.编辑按钮以及表格内显示上传成功的图片html代码就不放了, ...

ewebeditor网页文本编辑器、图片回显、弹窗自动关闭并刷新父页面

ewebeditor网页文本编辑器、图片回显、弹窗自动关闭并刷新父页面相关推荐

最新文章

热门文章