zoukankan      html  css  js  c++  java
  • 百度UEditor使用详解

     

    百度UEditor使用详解(作者:老卢 www.laoluit.com)
    相关视频教程下载:
    www.laoluit.com

    当我们还在使用FCKeditor时候,百度已经悄悄开发出了一套比它更强大的文本编辑器ueditor,专为中国人打造,请看--------:
    web文本编辑器被广泛的使用在论坛,留言系统,微博等网站,凡是用户能发布文字的网站,几乎到会使用到文本编辑器,老卢今天给大家介绍一款中国人自己开放的开源文本编辑器,全球最大中文搜索引擎--百度推出的UEditor。Ueditor是由百度web前端研发部开发的所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点,开源基于BSD协议,允许自由使用和使用代码.详细可参见网站:
     
    http://ueditor.baidu.com/index.html 。最新版1.1.7,可以在JSP,PHP,ASP等网站使用。

    好,现在跟老卢来看看如何使用:以JSP网站为例
    1下载ueditor
     访问这个网址:
    http://ueditor.baidu.com/index.html,找到下载
     然后下载ueditor1.1.7.zip或者其他的版本
    2 解压后我们会看到6个文件夹和3个js文件以及一个更新日志文本
     其中:
      官网上下载完整源码包,解压到任意目录,解压后的源码目录结构如下所示:

      _examples:编辑器完整版的示例页面
      _demos:编辑器的各种使用案例
      dialogs:弹出对话框对应的资源和JS文件
      themes:样式图片和样式文件
      server:涉及到服务器端操作的PHP、JSP等文件
      third-party:第三方插件
      editor_all.js:_src目录下所有文件的打包文件
      editor_all_min.js:editor_all.js文件的压缩版,建议在正式部署时才采用
    editor_config.js:编辑器的配置文件,建议和编辑器实例化页面置于同一目录

    3 在你的web工程或网站根目录下,新建一个名称叫ueditor文件夹。复制所有这些文件夹和js到这个文件夹
    到此准备工作完成
    4 在JSP页面包含所需要的JS和css

     <script type="text/javascript" charset="utf-8" src="ueditor/editor_config.js"></script>
        <script type="text/javascript" charset="utf-8" src="ueditor/editor_all_min.js"></script>
      <link rel="stylesheet" type="text/css" href="ueditor/themes/default/ueditor.css" />

    在此注意:引用的js或css必须正确,否则显示不出来
     我的ueditor文件夹和JSP文件同在根目录,所以写成以上。
    5 修改editor文件夹下边的editor_config.js文件中的第七行。
    把变量URL修改:var URL= "/你的网站名称或web工程名称/ueditor/";
    举例:我的工程名称是laoluit
    那么我修改后是var URL= "/laoluit/ueditor/";
    6 添加编辑器
     <body>
      <form action="dopost.jsp" method="post">
      <script type="text/plain" id="myEditor" class="myEditor">
      </script>
      <input type="submit" value="发帖">
      </form>
     
      <script type="text/javascript">
        var editor = new baidu.editor.ui.Editor();
        editor.render('myEditor');
    </script>
      </body>
    6 在另一个jsp或servlet中接收提交的数据
      <%
        //表单提交到了dopost.jsp,编辑器中编写的内容默认名称是editorValue
        //所以通过request.getParameter("editorValue")可以得到
        //接收到数据后打印到后台,你可以把它保存到数据库中。
        System.out.println(request.getParameter("editorValue"));
     
       %>
    7 补充
     设置编辑器中默认值:
      <script language="javascript" type="text/javascript">

      var op = {
       initialContent: '默认值。。。。。',  //初始化编辑器的内容
       minFrameHeight: 1024          //设置默认高度
       };
      var editor = new baidu.editor.ui.Editor(op);
      editor.render('myEditor');

      </script>

       

     

  • 相关阅读:
    MFC tab页面中获到其它页面的数据
    sqlite数据库中"Select * From XXX能查到数据,但是Select DISTINCT group From xxx Order By group却查不出来
    关闭程序出现崩溃(exe 已触发了一个断点及未加载ucrtbased.pdb)
    springboot 通用Mapper使用
    springBoot 发布war包
    springCloud Zuul网关
    springboot hystrix turbine 聚合监控
    springBoot Feign Hystrix Dashboard
    springBoot Ribbon Hystrix Dashboard
    springBoot Feign Hystrix
  • 原文地址:https://www.cnblogs.com/luleiitlife/p/8545098.html
Copyright © 2011-2022 走看看