百度富文本的使用

简介: 版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/hxdeng/article/details/77802227 下载百度富文本对应的版本创建工程引入百度对应的jar包修改jsp目录下的config.
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/hxdeng/article/details/77802227
  1. 下载百度富文本对应的版本
  2. 创建工程引入百度对应的jar包
  3. 修改jsp目录下的config.json
    “imageUrlPrefix”: “/BaiduUEditor”, /* 图片访问路径前缀[/工程发布的名字] */
  4. 引入js

  5. 编写HTML,在需要使用百度富文本的地方添加如下代码
<script type="text/plain" id="goodsInfo" name="goodsInfo"></script>

注意:type是“text/plain”id 是控制百度富文本功能,name是后台获取数据

  1. 初始化富文本
    var ue = UE.getEditor(‘goodsInfo’);
  2. 如果需要自定义功能,按照如下代码修改即可
    如果需要自定义富文本类容需要只需要在UE.getEditor()中传入需要的功能即可
   var ue = UE.getEditor('goodsInfo', {
            toolbars: [
                [
                    'undo', //撤销
                    'redo', //重做
                    'selectall', //全选
                    'bold', //加粗
                    'fontfamily', //字体
                    'fontsize', //字号
                    'forecolor', //字体颜色
                    'backcolor', //背景色
                    'indent', //首行缩进
                    'italic', //斜体
                    'formatmatch', //格式刷
                    'removeformat', //清除格式
                    'pasteplain', //纯文本粘贴模式
                    'touppercase', //字母大写
                    'tolowercase', //字母小写
                    'date', //日期
                    'time', //时间
                    'underline', //下划线
                    'strikethrough', //删除线
                    'subscript', //下标
                    'justifyleft', //居左对齐
                    'justifyright', //居右对齐
                    'justifycenter', //居中对齐
                    'justifyjustify', //两端对齐
                    'insertorderedlist', //有序列表
                    'insertunorderedlist', //无序列表
                    'simpleupload', //单图上传
                    'insertimage', //多图上传
                    'cleardoc', //清空文档
                    'fullscreen', //全屏
                 ]
            ],
            initialFrameWidth : 1000,//富文本宽度
            initialFrameHeight :200,//富文本高度
        });

注意:如果后台是用Struts2获取表单数据的时且Struts2拦截的是/会和百度富文本的冲突,建议修改为.action或者.do等其他。如果非要拦截/只能够重写Struts的核心拦截器,并且在web.xml中配置Struts2的核心拦截器的时候使用自定义的。

import java.io.IOException;
import javax.servlet.FilterChain;
import javax.servlet.ServletException;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.http.HttpServletRequest;
import org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter;
publicclass MyStruts2Filter extends StrutsPrepareAndExecuteFilter {
   @Override
   publicvoid doFilter(ServletRequest request, ServletResponse response, FilterChain chain) throws IOException, ServletException {
      HttpServletRequest req = (HttpServletRequest) request;
      String url = req.getRequestURI();
      /*
       * 检查url是否包含百度富文本路径
       * /BaiduUEditor/plugins/ueditor/jsp
       * /工程发布名称/百度富文本所在路径/jsp
       */
      if (url.contains("/BaiduUEditor/plugins/ueditor/jsp")) {
         chain.doFilter(request, response);
      } else {
         super.doFilter(request, response, chain);
      }
   }
}

注意:本文以jsp为例

相关文章
|
4月前
|
容器
百度富文本上传图片后样式崩塌
百度富文本上传图片后样式崩塌
32 0
百度富文本上传图片后样式崩塌
实现百度换肤功能
具体功能: 点击图片浏览器背景变为所点的图片
|
Web App开发
怎么让网页不进行自动翻译
怎么让网页不进行自动翻译
186 0
CSDN博客自定义栏目——Google、百度、必应站内搜索框
CSDN博客自定义栏目——Google、百度、必应站内搜索框
70 0
【selenium实例一】网易云歌单封面图片
简介:【selenium实例一】网易云歌单封面图片
【selenium实例一】网易云歌单封面图片
标签之美七——为网页添加音乐
标签之美七——为网页添加音乐
120 0
|
索引 搜索推荐
百度如何能实时检索到15分钟前新生成的网页?
本文描述的是Search&Index如何实时修改和检索,Spider子系统如何能实时找到全网新生成的网页,又是另外一个问题,未来撰文讲述。
881 0
|
Web App开发
FireFox 5开发计划曝光 内嵌PDF阅读器(组图)
开源中国社区援引Conceivably Tech的消息,为我们带来了Firefox 5的一些开发计划,其中包括内嵌的PDF阅读器,一个全新的首页Tab以及社会化分享功能等等。 具体的新特性可能会包含以下内容: 1.
835 0