• ssm项目中ueditor富文本编辑器的使用


    一、下载 https://ueditor.baidu.com/website/index.html

      将ueditor放到项目中合适的位置

      

    二 、 配置文件上传路径

       在utf8-jsp/jsp/config.json文件中更改文件长传路径

      

    三 、自定义工具类

      在utf8-jsp/ueditor.config.js中自定义工具类

      

    四、 前端使用

    // 引用
    <script type="text/javascript" charset="utf-8" src="${pageContext.request.contextPath }/BG/utf8-jsp/ueditor.config.js"></script>
    	<script type="text/javascript" charset="utf-8" src="${pageContext.request.contextPath }/BG/utf8-jsp/ueditor.all.min.js"></script>
    	<script type="text/javascript" charset="utf-8" src="${pageContext.request.contextPath }/BG/utf8-jsp/lang/zh-cn/zh-cn.js"></script>
    
    // 使用
    <div class="layui-form-item">
    				    <label for="L_answer" class="layui-form-label">内容</label>
    				<div class="layui-input-inline" style="340px;">
    					<!-- <textarea name="answer" id="L_answer" class="layui-textarea"></textarea> -->
    					<script id="hdxy" type="text/plain"style="800px;height:210px;">${notice.content}</script>
    				</div>
    			</div>
    
    // 初始化
    <!--富文本编辑器  -->
    	<script type="text/javascript">
    		//实例化编辑器
    		//建议使用工厂方法getEditor创建和引用编辑器实例,如果在某个闭包下引用该编辑器,直接调用UE.getEditor('editor')就能拿到相关的实例
    		var ue = UE.getEditor('hdxy');
    		/* ue.addListener("ready", function () {
    	        // editor准备好之后才可以使用
    	    	ue.setContent("${faq.answer}", false);
    	    }); */
    	</script>    
    

    五、后台使用

    try {
    			notice.setContent(editorValue); // 获取富文本编辑器中的所有内容
    			
    			Matcher m = Pattern.compile("<a[^>]*>([^<]*)</a>").matcher(editorValue);
    			while (m.find()) {
    				// System.out.println(m.group(1));  // 获取a标签内的内容
    				String filepath = m.group(0);	// 获取整个a标签
    				notice.setFilepath(filepath);
    			}
    			noticeService.updateNotice(notice);
    			response.getWriter().println(1);
    		} catch (Exception e) {
    			response.getWriter().println(0);
    		}
    

      

  • 相关阅读:
    .Net 平台下的互联网架构新思考
    图形化机构树静态页面
    互联网应用架构谈
    解决android调用IIS Express中的WCF服务时,出现错误400问题
    远程连接sql server 数据库的方法
    WPF样式——多条件触发器
    Ubuntu 16.04 安装 RabbitMQ
    session共享个人小结
    Nginx负载均衡配置
    MySQL数据库设置主从同步
  • 原文地址:https://www.cnblogs.com/petrolero/p/10065361.html
Copyright © 2020-2023  润新知