如题。

最近需要使用到网页后台富文本编辑器。经过同学推荐,最后决定使用百度家的Ueditor.

官方地址:http://ueditor.baidu.com/website/

贴吧地址:ueditor讨论吧

官方提供了网页上非常方便的自定义工具栏的功能。自定义之后直接下载对应的代码包并按照文档部署到项目中即可。其中主要的问题是路径的配置。

首先是将下载好的代码包发布到我们项目的根目录下面。然后在需要添加富文本编辑器的页面头部添加如下代码:

  1. <script type="text/javascript" src="相对该文档的路径/ueditor/ueditor.config.js"></script>
  2. <script type="text/javascript" src="相对该文档的路径/ueditor/ueditor.all.js"></script>
  3. <script>
  4. <span style="white-space:pre">  </span>window.UEDITOR_HOME_URL = "/项目相对网址池绝对路径/ueditor";
  5. </script>

配置路径这一块是非常重要的。特别是下面的Ueditor的路径,是相对我们整个代码库的目录的。

配置完成之后,直接在我们网页中的<textarea>标签下面添加ueditor的初始化代码:

  1. <script type="text/javascript">
  2. var editor = new UE.ui.Editor({initialFrameHeight:100,initialFrameWidth:400 });
  3. editor.render("actDescribe");
  4. </script>

官方的文档并没有给出如何设置ueditor的宽度和高度的说明。这是我在网上网友那里找到的解决方法。在声明编辑器的变量的时候,在参数列表中添加对initialFrameHeight和initialFrameWidth的设置即可。注意,数值后面不需要添加px。

可是,这种方法有时候奏效有时候也不奏效,因为我碰过一种情况就是无论如何调整initialHeight和initialWidth的数值,编辑器的大小都还是不会改变。这个时候,我发现,可以通过调整editor所跟随的textarea的宽高来撑开editor的大小。这也是一种方法,各位同学在官方说明文档出来之前可以两种方法都尝试一下。

当然,好用的文本编辑器还是有很多的,例如kindeditor,之前准备使用这个的,而其文档方面也比较齐全,同时,整个编辑器的size也比较小,对网页的加载速度比较有利。百度的Ueditor还是有点庞大。加载时会有卡顿的速度。估计是我对底层代码的研究不够,多了很多不必要的内容。慢慢研究或许可以使得Ueditor变小。

Ueditor自定义默认宽度高度的更多相关文章

  1. 百度ueditor上传图片时如何设置默认宽高度

    百度ueditor上传图片时如何设置默认宽高度 一.总结 一句话总结:直接css或者js里面限制一下就好,可以用html全局限制一下图片的最大高度 直接css或者js里面限制一下就好,可以用html全 ...

  2. 富文本编辑器UEditor自定义工具栏(一、基础配置与字体、背景色、行间距、超链接实现)

    导读:UEditor 是由百度「FEX前端研发团队」开发的所见即所得富文本web编辑器,功能强大,可定制,是一款优秀的国产在线富文本编辑器,编辑器内可插入图片.音频.视频等. 一.UEditor自定义 ...

  3. 富文本编辑器UEditor自定义工具栏(二、插入图片、音频、视频个性化功能按钮和弹层及自定义分页符)

    导读:本篇将简单探讨插入图片.音频.视频的功能按钮实现方式 传送门:富文本编辑器UEditor自定义工具栏(一.基础配置与字体.背景色.行间距.超链接实现) 一.效果图 1.UEditor自定义工具栏 ...

  4. 富文本编辑器UEditor自定义工具栏(三、自定义工具栏功能按钮图标及工具栏样式简单修改)

    导读 富文本编辑器UEditor提供丰富了定制配置项,如果想设置个性化的工具栏按钮图标有无办法呢?答案是肯定的!前两篇博文简要介绍了通过将原工具栏隐藏,在自定义的外部按钮上,调用UEditor各命令实 ...

  5. Ueditor设置默认字体、字号、行间距,添加字体种类(转)

    Ueditor默认字体.字号.行间距的修改: ueditor默认字号是16号,默认字体为sans-serif,默认行间距为5px,如下图所示: 首先,修改ueditor.all.js文件中如上图红框中 ...

  6. CSS样式实现溢出超出DIV边框宽度高度的内容自动隐藏方法

    CSS样式实现溢出超出DIV边框宽度高度的内容自动隐藏方法 平时我们布局时候,有的文字内容多了会超过溢出我们限制的高度,有的图片会撑破DIV,让网页错位变乱. 这样我们就需要解决如何使用CSS来超出设 ...

  7. 第一百六十六节,jQuery,基础 DOM 和 CSS 操作,元素内容,元素属性,css和class,元素宽度高度、偏移、滚动条

    jQuery,基础 DOM 和 CSS 操作,元素内容,元素属性,css和class,元素宽度高度.偏移.滚动条 学习要点: 1.DOM 简介 2.设置元素及内容 3.元素属性操作 4.元素样式操作 ...

  8. swiper轮播图设置每组显示的个数及自定义slide宽度

    一.html演示代码: <div class="swiper-container"> <div class="swiper-wrapper"& ...

  9. Django和Ueditor自定义存储上传文件的文件名

    django台后默认上传文件名 在不使用分布式文件存储系统等第三方文件存储时,django使用默认的后台ImageField和FileField上传文件名默认使用原文件名,当出现同名时会在后面追加下随 ...

随机推荐

  1. shell编程的一些例子3

    数值处理 1.let 命令 bash 的内部命令let可以用来计算算术表达式的值.如果表达式中有空格或者特殊字符,则应将表达式括在双引号中. let的语法命令:let express-list 如果最 ...

  2. 2、.net NVelocity中原生javascript ajax封装使用

    在页面上,我们经常会遇到局部刷新的例子,这个时候,就需要用到ajax, 因为很多代码都是公用的,所以我们想到了,将代码封装,简化了使用,减少了冗余 javascript ajax代码如下: var x ...

  3. android View 关于transient

    今天来研究一下 ListView 的删除动画 由于 ListView 卷动时会把画面上的 item 重用以显示不同数据 这样会导致我们可能会删除到非正确的 item 或是出现显示上的问题(该 item ...

  4. how to uninstall devkit

    http://www.uninstallapp.com/article/How-to-uninstall-Perl-Dev-Kit-PDK-8.0.1.289861.html PerfectUnins ...

  5. bzoj2553

    似乎挂精度了,不过这是一道好题 很明显看题知算法,知道这道题肯定是AC自动机上矩阵乘法 首先要明确一点,对一个字符串,怎样划分禁忌串最多 根据求最多不相交线段可知,从头到尾能划分出禁忌串就划分 根据这 ...

  6. JW Player 现在支持 Azure 媒体服务

    Vishal Sood Azure媒体服务首席项目经理 此合作伙伴关系是关于什么内容? Azure媒体服务现已支持一些最常见的流媒体格式,其中包括 Microsoft SmoothStreaming ...

  7. web开发小节.txt

    我最近一直在看这个的java web项目涉及到的知识,今天突然感觉思路烁然开明. 我们经常会将java web开发说成是MVCV: view 我在这里姑且就介绍JSP吧.JSP其实就是在原来的静态页面 ...

  8. 海量jQuery插件

    转自:http://blog.csdn.net/zzq58157383/article/details/6900142 提醒大家在使用的时候注意jQuery包的版本问题,最好是使用相同的版本,因为使用 ...

  9. 开源(免费)三维 GIS(地形,游戏) 续1

    转自:http://www.cnblogs.com/xiexiaokui/archive/2009/04/02/1428525.html 转自 三维数字地球发布平台探索--几款开源软件介绍 http: ...

  10. HDJ -- 1022

    #include<iostream> #include<cstdio> #include<string> #define MAXN 10 using namespa ...