ueditor编辑器初始化

简介: ueditor编辑器初始化

<!-- 加载编辑器的容器 -->
<script id="container" name="content" type="text/plain"><!-- 注意type类型text/plain不是text/javascript -->
          <table>
           <tr>
              <td>1</td>
              <td>2</td>
              <td>3</td>
              <td>4</td>
           </tr>
           <tr>
              <td>a</td>
              <td>b</td>
              <td>c</td>
              <td>d</td>
           </tr>
        </table>
      <div>我是一段话</div>
        <ul>
           <li>1</li>
           <li>2</li>
           <li>3</li>
        </ul>
        <div>我是2段话</div>
</script>
    <!-- 配置文件 -->
    <script type="text/javascript" src="./ueditor.config.js"></script>
    <!-- 编辑器源码文件 -->
    <script type="text/javascript" src="./ueditor.all.js"></script>
    <!-- 实例化编辑器 -->
    <script type="text/javascript">
        var ue = UE.getEditor('container');//初始化
        //监听
        UE.getEditor('container').addListener('click',function(event,o){
                //选中值
                console.info(ue.selection.getRange().startContainer.data);
                //选中节点
                console.info(ue.queryCommandValue('elementpath'));
        });
    </script>
参数设置两种方式:
  1. 修改config.js 文件
  2. 初始化配置参数
//初始化
var ue = UE.getEditor('container',{
            toolbars:[],//不显示toolbar
            elementPathEnabled:false,//关闭底部显示元素
            wordCount:false //关闭字数统计
            readonly:true//禁止编辑
            /*,initialFrameWidth: '100%',//宽度  //或者指定宽度 400 不要加px
            initialFrameHeight: '100%'//高度*/                
               scaleEnabled:true//是否可以拉伸长高,默认true(当开启时,自动长高失效)
         });


相关文章
|
6月前
|
JavaScript 前端开发
layui用layer.open打开子页面并获取子页面的ueditor富文本编辑器的内容
该内容描述了一个Web应用的交互流程,其中父页面通过调用子页面的JavaScript函数来获取富文本编辑器的内容。子页面包含一个富文本编辑器和一个`callbackdata`函数,用于返回编辑器的文本内容。父页面使用`layer.open`打开子页面作为弹窗,并在用户点击提交时,访问子页面的`callbackdata`获取编辑器内容,同时检查其他表单字段,如类型、标题等是否为空,以确保数据完整。
567 0
|
JSON 前端开发 JavaScript
富文本编辑器Ueditor实战(三)-springboot集成
通过本文,您可了解springboot如何集成ueditor,如何自定义扩展后端的文件上传功能。
693 0
富文本编辑器Ueditor实战(三)-springboot集成
|
3月前
|
存储 安全 数据安全/隐私保护
Django 后端架构开发:富文本编辑器权限管理与 UEditor 、Wiki接入,实现 Markdown 文本编辑器
Django 后端架构开发:富文本编辑器权限管理与 UEditor 、Wiki接入,实现 Markdown 文本编辑器
136 0
|
资源调度 JavaScript
vue项目:集成富文本编辑器 - 百度ueditor(vue-ueditor-wrap)
vue项目:集成富文本编辑器 - 百度ueditor(vue-ueditor-wrap)
598 0
|
Java 应用服务中间件 对象存储
富文本编辑器Ueditor实战(二)-图片上传
本文重点阐述了如何扩展Ueditor的图片上传功能,以及在实际中,如何根据项目实际情况,设置图片信息的动态展示思路。
852 0
富文本编辑器Ueditor实战(二)-图片上传
|
前端开发
ueditor 百度富文本编辑器后端配置(上传图片)
ueditor 百度富文本编辑器后端配置(上传图片)
461 0
|
前端开发 JavaScript 搜索推荐
前端封装库/工具库的编辑器之UEditor
随着互联网时代的到来,Web应用程序的内容创作和编辑变得越来越重要。而为了更高效地进行内容编辑和管理,前端封装库/工具库的出现成为了一个非常好的解决方案。其中一个经典的编辑器就是UEditor。
137 0
|
开发框架 前端开发 JavaScript
【前端】简单配置使用百度在线文本编辑器UEditor
在本篇文章中,我们讲一起了解下百度在线文本编辑器UEditor的简单配置使用 目前在线编辑器插件网上挺多的,个人觉得UEditor在UI和功能上还是不错的
967 0
|
Java 应用服务中间件 API
富文本编辑器Ueditor实战(一)
本文简单说明如何在tomcat中部署ueditor,并举例介绍了他的api以及相关工具栏,用户可以根据需要进行调整。
481 0
富文本编辑器Ueditor实战(一)
|
4月前
|
开发工具
vi编辑器,现在vi\vim是文本文件进行编辑的最佳选择,Vim是vi的加强的版本,兼容vi的所有指令,vim编辑器有三种工作模式,一开始进入的是命令模式,命令模式i是插入的意思,两下y+p复制内容
vi编辑器,现在vi\vim是文本文件进行编辑的最佳选择,Vim是vi的加强的版本,兼容vi的所有指令,vim编辑器有三种工作模式,一开始进入的是命令模式,命令模式i是插入的意思,两下y+p复制内容