富文本框

最新推荐文章于 2023-01-04 17:14:27 发布

转载最新推荐文章于 2023-01-04 17:14:27 发布 · 100 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：https://my.oschina.net/u/2405705/blog/512170

文章标签：

#javascript #python #ViewUI

本文介绍如何在网站中使用Ueditor编辑器实现活动详情的输入，包括引入CSS和JS，设置编辑器样式及配置，以及通过jQuery实例化编辑器并设置内容。

2019独角兽企业重金招聘Python工程师标准>>>

1:引用css和js

css:

js:

<div class="form-group" style="clear: both">
<div style="height: 40px;float: left">
<span class="input-title font4"><span style="color:#FF0000;">*</span> <span style="color:#333333;">&nbsp;</span>活动详情</span>
</div>
<div style="float: left">
<!--style给定宽度可以影响编辑器的最终宽度-->
<script type="text/plain" id="editorActivityDetail" style="width:90%;height:240px;">
<p>这里我可以写一些输入提示</p>
</script>
<script type="text/javascript" charset="utf-8" src="<%=path %>/UEditor/umeditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="<%=path %>/UEditor/umeditor.min.js"></script>
<script type="text/javascript" src="<%=path %>/UEditor/lang/zh-cn/zh-cn.js"></script>
<script type="text/javascript">
//实例化编辑器
$(function(){
var um = UM.getEditor('editorActivityDetail');
um.setContent("${activity.activityDetail}");
});
</script>
</div>
<div class="activityDetailError"  style="display:none;clear: both">
<span class="error">请输入活动详情</span>
</div>
</div>

转载于:https://my.oschina.net/u/2405705/blog/512170