专栏首页Nicky's blogWEB项目中使用UEditor(富文本编辑器)

WEB项目中使用UEditor(富文本编辑器)

Ueditor富文本编辑器是在很多项目里经常用到的框架,是百度开发团队开发的一款很好用的富文本编辑器

下面就是我在一个系统里用到的,有了富文本编辑器,管理员使用起来不是很方便?

所以本博客介绍这个富文本编辑器的使用哈!觉得写得不错的请点赞哈,有建议欢迎提哈!^V^

下载链接:http://ueditor.baidu.com/website/download.html

具体的使用请看官网:http://ueditor.baidu.com/website/index.html

下载富文本编辑器后,我们打开MyEclipse或者其它编辑软件,选择file->import,选择文件系统,导入下载好的Ueditor

然后启动tomcat服务器

http://localhost:8080/项目名称t/ueditor1_4_3_2/jsp/controller.jsp?action=config

这个要根据你的项目进行修改的哈

可以输出这个,什么编辑器导入成功

引入js,charset属性设置为UTF-8的,因为我的系统默认是UTF-8的

<span style="font-size:18px;"><script type="text/javascript" charset="UTF-8" src="<%=basePath %>ueditor1_4_3_2/ueditor.config.js"></script>
    <script type="text/javascript" charset="UTF-8" src="<%=basePath %>ueditor1_4_3_2/ueditor.all.min.js"> </script></span>

复制ueditor里面的index,html代码,这个要根据需要去复制的

<span style="font-size:18px;"><script type="text/javascript">

    //实例化编辑器
    //建议使用工厂方法getEditor创建和引用编辑器实例,如果在某个闭包下引用该编辑器,直接调用UE.getEditor('editor')就能拿到相关的实例
    var ue = UE.getEditor('editor');


  
    function getContent() {
        var arr = [];
        arr.push("使用editor.getContent()方法可以获得编辑器的内容");
        arr.push("内容为:");
        arr.push(UE.getEditor('editor').getContent());
        alert(arr.join("\n"));
    }
    
   
</script></span>

因为我做的系统只要实现将编辑的文本和样式一起写入数据库,所以只要使用getContext方法就可以

在form表单里加入:

<script id="editor" type="text/plain" style="width:1024px;height:500px;"></script>

注意这些属性都不用随便修改的哦

获取文本和文本样式的参考代码,

String introduction = new String(request.getParameter("editorValue").getBytes("iso-8859-1"),"UTF-8");   这个就是获取文本和文本样式的代码,然后下面的代码只是参考的,只要用String introduction = new String(request.getParameter("editorValue").getBytes("iso-8859-1"),"UTF-8");   这代码就可以获取内容

public class AddSpotInfoServlet extends HttpServlet {

	/**
	 * 
	 */
	private static final long serialVersionUID = 1L;

	/**
	 * 
	 */
	public void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		response.setContentType("text/html;charset=UTF-8");
		PrintWriter out = response.getWriter();
		request.setCharacterEncoding("UTF-8");

		String introduction = new String(request.getParameter("editorValue").getBytes("iso-8859-1"),"UTF-8");
		String picture = Constant.ImgPath.path;
		String position = new String(request.getParameter("position").getBytes("iso-8859-1"),"UTF-8");
		String priceString = new String(request.getParameter("price").getBytes("iso-8859-1"),"UTF-8");
		Double price = Double.parseDouble(priceString);
		String sortString = new String(request.getParameter("sort").getBytes("iso-8859-1"),"UTF-8");
		int spot_sort = Integer.parseInt(sortString);
//		String timeString = new String(request.getParameter("time").getBytes("iso-8859-1"),"UTF-8");
//		Date time = Date.valueOf(timeString);
		String tour_project = new String(request.getParameter("tour_project").getBytes("iso-8859-1"),"UTF-8");
		
		Spot spot = new Spot();
		spot.setIntroduction(introduction);
		spot.setPicture(picture);
		spot.setPosition(position);
		spot.setPrice(price);
		spot.setSpot_sort(spot_sort);
		spot.setTour_project(tour_project);
		
		SpotDAO spotDao = new SpotDAOImpl();
		boolean flag = spotDao.addInfo(spot);
		if(flag){
			response.sendRedirect(Constant.WEB_URL_SPOT_SERVLET);
		}
		
		out.flush();
		out.close();
	}

	/**
	 * 
	 */
	public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		doGet(request, response);
	}

}

ok,可以将文本和样式一起写入数据库了,哈哈哈,^V^

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • JSP页面跳转编码设置(Tomcat服务器)

    而这个服务器可以是Tomcat、Weblogic,Tomcat服务器默认的编码为iso-8859-1,Weblogic默认的编码为UTF-8,所以程序运行时要注...

    SmileNicky
  • SpringBoot源码学习系列之SpringMVC自动配置

    web的自动配置在SpringBoot项目中是一个很重要的方面,实现代码在spring-boot-autoconfigure工程里:

    SmileNicky
  • Mybatis3.2扫描ant通配符格式的typeAliasPackage

    业务场景:首先项目进行分布式拆分之后,按照模块再分为为api层和service层,web层。 其中订单业务的实体类放在com.muses.taoshop.it...

    SmileNicky
  • 为什么Python类语法应该不同?

    如果您已经使用了任何编程语言很长一段时间,您就会发现您想要的东西跟它原有的是不同的。Python对我来说是真的是这样。如果可以的话,对于Python中很多的我想...

    小小科
  • 安卓基础干货(九):安卓内容提供者的学习

    ContentProvider 在android中的作用是对外共享数据,也就是说你可以通过ContentProvider把应用中的数据共享给其他应用访问,其他应...

    緣來
  • 5.python中文编码

    python到目前为止,一共有两个版本,分别是2.x和3.x版本,根据官方正式通知2020年停止对python更新和维护,距离今天还有110天左右,所以正在学习...

    猿说编程[Python和C]
  • 镁客请讲 | 狗尾草邱楠:做更好的AI虚拟生命

    互联网时代的深入发展刮来了一波宅文化,足不出户,在家中上网、聊天、打游戏成为新一代年轻人乐此不疲的生活方式,而这样的生活方式也让二次元宅文化得以生根、发芽,伴随...

    镁客网
  • 前端面试系列(8)

      方案一:思想 首先对数组进行排序(小 》大),第一项为最小值,最后一项为最大值

    李才哥
  • 解决 fsockopen() 报错 unable to connect to 的方法

    这个问题出现在使用 Xunsearch 的时候,Xunsearch 是一个高性能、全功能的全文检索解决方案,旨在帮助一般开发者针对既有的海量数据,快速而方便地建...

    沈唁
  • 【Vue.js】Vue.js介绍及MVVM模式

    魏晓蕾

扫码关注云+社区

领取腾讯云代金券