Ueditor富文本编辑器是在非常多项目里经经常使用到的框架,是百度开发团队开发的一款非常好用的富文本编辑器
以下就是我在一个系统里用到的,有了富文本编辑器,管理员使用起来不是非常方便?
所以本博客介绍这个富文本编辑器的使用哈!
认为写得不错的请点赞哈。有建议欢迎提哈!
^V^
下载链接:http://ueditor.baidu.com/website/download.html
详细的使用请看官网:http://ueditor.baidu.com/website/index.html
下载富文本编辑器后。我们打开MyEclipse或者其他编辑软件,选择file->import,选择文件系统,导入下载好的Ueditor
然后启动tomcatserver
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(" ")); } </script></span>
由于我做的系统仅仅要实现将编辑的文本和样式一起写入数据库。所以仅仅要使用getContext方法就能够
在form表单里增加:
<script id="editor" type="text/plain" style="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^