先把内容放入一个input中

<input id="detail" type="hidden" value="${sysCarousel.detail}"/>

然后判断是插入还是修改

如果是修改才会向富文本编辑器中嵌入html代码

<script type="text/plain" id="chvGoodsRemark" name="detail"  style="margin-bottom:100px;width:1024px;height:700px;"></script>
<c:if test="${sysCarousel.id==null}">
<script type="text/javascript">
UE.getEditor("chvGoodsRemark", {
autoClearinitialContent:false,wordCount:true,elementPathEnabled:true,autoHeightEnabled:false,maximumWords:0,fullscreen:false,initialFrameWidth:1000,initialFrameHeight:320
});
</script>
</c:if> <c:if test="${sysCarousel.id!=null}">
<script type="text/javascript">
UE.getEditor("chvGoodsRemark", {
autoClearinitialContent:false,wordCount:true,elementPathEnabled:true,autoHeightEnabled:false,maximumWords:0,fullscreen:false,initialFrameWidth:1000,initialFrameHeight:320
});
</script>
</c:if>

然后js控制插入代码

$(function(){
window.setTimeout(setContent,1000);//一秒后再调用赋值方法
}); //给ueditor插入值
function setContent(){
var a =$('#detail').val();
UE.getEditor('chvGoodsRemark').execCommand('insertHtml',a);
}

如果是想在html页面中直接嵌入一段html(比如<p>123<p>显示123)代码,直接jquery获取这段代码,或者手写一段代码,通过js函数向<text></text>里面赋值即可,例子如下:

<text id="showInfo2"></text>
 var divshow = $("#showInfo2");
divshow.text("");// 清空数据
divshow.append(data); // 添加Html内容,不能用Text 或 Val
<%@ tag language="java" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<%@ attribute name="input" type="java.lang.String" required="true"
description="输入框"%>
<%@ attribute name="value" type="java.lang.String" required="true"
description="值"%>
<%@ attribute name="maxWidth" type="java.lang.String" required="false"
description="最大宽度"%>
<%@ attribute name="maxHeight" type="java.lang.String" required="false"
description="最大高度"%>
<script id="${input}_editor" name="${input}" type="text/plain" class="required" style="width:95%;height:600px;"></script>
<script type="text/javascript">
UE.getEditor('${input}_editor').addListener("ready", function () {
setTimeout('${input}init()',);
});
/* $(function(){
setTimeout('${input}init()',500);
}); */
function ${input}init(){
var html = $('#${input}').val();
UE.getEditor('${input}_editor').execCommand('insertHtml',html); } </script>
<script type="text/javascript">
//实例化编辑器
//建议使用工厂方法getEditor创建和引用编辑器实例,如果在某个闭包下引用该编辑器,直接调用UE.getEditor('editor')就能拿到相关的实例
var ue = UE.getEditor('${input}_editor');
</script>
<input id="${input}" type="hidden" value="${value}" class="required"/>
<script type="text/javascript" src="${ctxStatic}/ueditor/ueditor.config.js"></script>
<script type="text/javascript" src="${ctxStatic}/ueditor/ueditor.all.js"></script>
<script type="text/javascript" charset="utf-8" src="${ctxStatic}/ueditor/lang/zh-cn/zh-cn.js"></script>

富文本编辑器嵌入指定html代码的更多相关文章

  1. 在Asp.Net或.Net Core中配置使用MarkDown富文本编辑器有开源模板代码(代码是.net core3.0版本)

    研究如何使用Markdown你们可能要花好几天才能搞定,但是看我的文章或者下载了源码,你搞定一般在10分钟之内.我先给各位介绍下它: Markdown 是一种轻量级标记语言,它允许人们使用易读易写的纯 ...

  2. 在Asp.Net Core中配置使用MarkDown富文本编辑器实现图片上传和截图上传(开源代码.net core3.0)

    我们的富文本编辑器不能没有图片上传尤其是截图上传,下面我来教大家怎么实现MarkDown富文本编辑器截图上传和图片上传. 1.配置编辑器到html页 <div id="test-edi ...

  3. 百度富文本编辑器UEditor安装配置全过程

    网站开发时富文本编辑器是必不可少的,他可以让用户自行编辑内容的样式然后上传到后台!下面我们来介绍如何安装使用百度富文本编辑器 一.下载并且设置百度富文本编辑器的样式     你可以去百度UEditor ...

  4. kindeditor富文本编辑器初步使用教程

    下载kindeditor 可以选择去官网下载(http://kindeditor.net/down.php),不过要FQ:或者直接CSDNhttp://download.csdn.net/downlo ...

  5. MarkDown富文本编辑器怎么加载模板文件

    我们只需要一段加载代码就可以搞定MarkDown加载模板文件. $("#md-demo").bind('click', function () { $.get("/Lib ...

  6. 富文本编辑器kindeditor的使用

    第一步:导入前端js文件 <!-- 富文本编辑器 --> <link rel="stylesheet" href="../plugins/kindedi ...

  7. 前端vue-TinyMCE富文本编辑器表情插件报错解决

    最近项目中需要使用文本编辑器,比较了下最终选择了TinyMCE这款富文本编辑器.我安装的是TinyMCE v5但是在使用表情插件的时候,表情一直都出不来,报错信息如下: Uncaught Syntax ...

  8. 富文本编辑器上传图片需要配置js,后台代码

    富文本编辑器上传图片需要配置js,后台代码

  9. JSP嵌入ueditor、umeditor富文本编辑器

    一.下载: 1.什么是富文本编辑器?就是: 或者是这个: 其中第一个功能比较详尽,其主要用来编写文章,名字叫做udeitor. 第二个就相对精简,是第一个的MINI版,其主要用来编辑即时聊天或者发帖, ...

随机推荐

  1. 013 session_flush

    在hibernate中也存在flush这个功能,在默认的情况下session.commit()之前时,其实执行了一个flush命令. Session.flush功能: ②理缓存: ②执行sql(确定是 ...

  2. DOM4J介绍与代码示例(2)-XPath 详解

    XPath 详解,总结 XPath简介 XPath是W3C的一个标准.它最主要的目的是为了在XML1.0或XML1.1文档节点树中定位节点所设计.目前有XPath1.0和 XPath2.0两个版本.其 ...

  3. Chart.js – 效果精美的 HTML5 Canvas 图表库

    Chart.js 是一个令人印象深刻的 JavaScript 图表库,建立在 HTML5 Canvas 基础上.目前,它支持6种图表类型(折线图,条形图,雷达图,饼图,柱状图和极地区域区).而且,这是 ...

  4. jenkins+ant+jmeter html报告文件作为附件发送(ant-jmeter支持javamail)

    前言:由于ant-jmeter目前的版本不支持javamail,也就是说发送邮件时只能借助jenkins自带的发送邮件插件来发送报告. 但是jenkins发送邮件支持发送邮件内容(且有价值.有营养的内 ...

  5. Qzone 高性能 HTTPS 实践

    WeTest导读 自从去年QQ空间移动端页面开始切换到HTTPS之后,页面性能遇到了比较大的挑战,HTTPS对页面访问速度带来了比较大的影响,所以我们通过实践总结了一些能够提升HTTPS页面访问速度的 ...

  6. Best packages for data manipulation in R

    dplyr and data.table are amazing packages that make data manipulation in R fun. Both packages have t ...

  7. spring MVC 乱码问题

    (转) spring的字符集过滤通过用于处理项目中的乱码问题,该过滤器位于org.springframework.web.filter包中,指向类CharacterEncodingFilter,Cha ...

  8. iphone手机中对于html和css的一些特殊处理

    1.iphone safari iso系统不兼容:hover的解决办法: 方法一: a:hover设置的样式在IOS系统的浏览器内显示不出来,看来是IOS系统的移动设备中,需要在按钮元素或者是body ...

  9. VR全景智慧城市,完美的将虚拟与现实结合

    很多人都粗浅的认为,VR虚拟智慧城市只是简单的将智慧城市和虚拟现实相结合的产物,这样的VR虚拟智慧城市看起来更像是个VR内容产品,而非城市建设成果.但是我们换个角度来思考的话,现在很多VR虚拟智慧城市 ...

  10. 学习web前端怎样入门?初学者赶紧看过来!

    web前端怎么样才能入门,首先我们要从什么是初级web前端工程师说起: 按照我的想法,我把前端工程师分为了入门.初级.中级.高级这四个级别, 入门级别指的是了解什么是前端(前端到底是什么其实很多人还是 ...