当前位置: 首页 > 编程日记 > 正文

ckedit 文本编辑器

Ckeditor是一个功能非常强大的富文本编辑器,博客园有使用此编辑器,其功能完全可以与MS的Word媲美。

用起来也非常方便。下面是本人总结的安装步骤:

第一步,从http://ckeditor.com/download 下载ckeditor文件包

第二步,新建web项目,然后把下载的ckeditor文件包直接放在下面,

第三步,创建实例,此时如下图

整个sample.html的代码是:(此时笔者已经把它设置为全屏显示了)

<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<TITLE>Editor</TITLE>
<script src="ckeditor/adapters/jquery-1.9.1.min.js"></script>
<script src="ckeditor/ckeditor.js"></script>
<script src="ckeditor/adapters/jquery.js"></script>
</HEAD>
<BODY>

<script type="text/javascript">

function fullping() {
var oCKeditor;
oCKeditor = CKEDITOR.replace('content');
oCKeditor.on('instanceReady', function (event) {
var editor = event.editor;
setTimeout(function () {
// Delay bit more if editor is still not ready.
if (!editor.element) {
setTimeout(arguments.callee, 100);
return;
}
event.removeListener('instanceReady', this.callee);
if (editor.name == 'content') {
var command = editor.getCommand('maximize');
command.exec();
}
}, 0);
}, null, null, 9999);
};
</script>

<script type="text/javascript">
$(document).ready( function() {
//$('#content').ckeditor();

fullping();
});

</script>
<div>
<textarea id="content" name="content" class="ckeditor">
</textarea>

</div>
</BODY>
</HTML>

第四步,执行结果如下:

第五步,上传图片,

可以打开ckeditor/plugins/image/dialogs/image.js文件,搜索“b.config.image_previewText”就能找到这段鸟语了,(b.config.image_previewText||'')单引号中的内容全删了,注意别删多了。

扫除这个障碍,下面来研究图片上传。

首先,还是image.js这个文件,搜索“upload”可以找到这一段

id:'Upload',hidden:true

实际上上传功能被隐藏了,把上面的true改成false,再打开编辑器,就能找到上传功能了。

至于上传的action可以在config.js里配置,

config.filebrowserUploadUrl="actions/ckeditorUpload";

var pathName = window.document.location.pathname;
//获取带"/"的项目名,如:/uimcardprj
var projectName = pathName.substring(0, pathName.substr(1).indexOf('/') + 1);
config.filebrowserImageUploadUrl = projectName+'/upload.do'; //固定路径

后台的上传要自己写哦。

有同学要demo,可以留名,发你。

转载于:https://www.cnblogs.com/xiexy/p/3891731.html

相关文章:

为什么我害怕数据结构学得好的程序员?

我害怕数据结构学得好的程序员&#xff0c;一跟他们讨论技术&#xff0c;我就感觉自己不是程序员&#xff0c;仅仅是在搬砖维持生活。我所拥有的编程技巧是什么&#xff1f;不就是每个程序员都会的&#xff0c;对数据库的增删改查吗&#xff1f;每一个初入职场的程序员都会。但…

Go语言基础介绍

Go是一个开源的编程语言。Go语言被设计成一门应用于搭载Web服务器&#xff0c;存储集群或类似用途的巨型中央服务器的系统编程语言。目前&#xff0c;Go最新发布版本为1.10.Go语言可以运行在Linux、FreeBSD、Mac OS X和Windows系统上。1. 结构&#xff1a;Go语言的基础组成有以…

强制退出WinForm程序之Application.Exit和Environment.Eixt

这几天在做一个把大量Infopath生成的XML数据&#xff0c;进行处理的程序&#xff0c;我用了MDI子窗体&#xff0c;每个窗体包含了各自的功能&#xff0c;如&#xff0c;遍历目录及其子目录检查文件类型并自动生成Sql语句并入库、对Infopath数据的自动检查、对数据中的某些域的替…

Oracle Study之--Oracle等待事件(3)

Oracle Study之--Oracle等待事件&#xff08;3&#xff09;Db file parallel read这是一个很容易引起误导的等待事件&#xff0c;实际上这个等待事件和并行操作&#xff08;比如并行查询&#xff0c;并行DML&#xff09;没有关系。 这个事件发生在数据库恢复的时候&#xff0c;…

Windows下通过Python 3.x的ctypes调用C接口

在Python中可以通过ctypes来调用动态库中的C接口&#xff0c;具体操作过程如下&#xff1a;1. 使用vs2013创建一个加、减、乘、除的动态库&#xff0c;并对外提供C接口&#xff0c;code内容如下&#xff1a;math_operations.hpp: #ifndef TEST_DLL_1_MATH_OPERATIONS_HPP_ #def…

如何在3天内拿下DigSci大赛的亚军?| DigSci科学数据挖掘大赛

作者 | 朱翔宇(DOTA)来源 | AI算法之心&#xff08;AIHeartForYou&#xff09;【导读】本文将基于作者在中国计算机大会方案宣讲PPT中的内容&#xff0c;给出此次比赛的完整方案&#xff0c;主要从赛题理解、建模核心思路、算法核心思想等角度阐述&#xff0c;同时对相关细节进…

如何获得Oracle系统性能统计? Oracle大型数据库系统在AIXUNIX上的实战详解 集中讨论 14...

累计读者的来信中&#xff0c;有若干位同仁谈到Oracle的性能问题。什么叫性能慢&#xff1f;怎么量化性能统计&#xff1f;问题我不一一列出了&#xff0c;下面的文字大部分来自Oracle 英文文档&#xff0c;我认为描述的极为精确&#xff0c;比我说的强。 如果有效地诊断性能问…

百度搜索查询命令——组合型

在百度上搜索一下&#xff0c;就会出现一堆关于查询搜索的命令&#xff0c;比如&#xff1a;site&#xff0c;domain&#xff0c;双引号&#xff0c;减号等等。今日&#xff0c;我简单总结一点组合型命令&#xff0c;希望对大家有帮助。 1、domain命令、减号-和的inurl组合 公式…

Delphi多线程编程中的技巧

1&#xff09;创建线程 MsgThread : TMsgThread.Create(False) ; //创建并执行线程 MsgThread : TMsgThread.Create(True) ; //创建线程后挂起 constructor Create(CreateSuspended: Boolean); 中的参数CreateSuspended表示创建后是否挂起线程。 &#xff08;2&#xff09;设置…

Ubuntu14.04下配置OpenGL及测试代码

ubuntu14.04 64位下&#xff0c;默认是没有安装OpenGL相关依赖库的&#xff0c;若安装&#xff0c;则依次执行如下几条命令即可&#xff1a; $ sudo apt-get update $ sudo apt-get install build-essential $ sudo apt-get install libgl1-mesa-dev $ sudo apt-get install li…

VarGFaceNet:地平线提出轻量级、有效可变组卷积的人脸识别网络

作者 | Mengjia Yan、Mengao Zhao、Zining Xu、Qian Zhang、Guoli Wang、Zhizhong Su译者 | 刘畅编辑 | Jane出品 | AI科技大本营&#xff08;ID&#xff1a;rgznai100&#xff09;【导读】为了提高用于人脸识别的轻量级网络的判别和泛化能力&#xff0c;本文提出了一种有效的可…

【TortoiseSVN使用教程】

TortoiseSVN使用教程 TortoiseSVN是一个SVN的客户端 1.Checkout Repository 首 先要Checkout服务器端的Repository&#xff0c;所谓的Checkout就是指获得服务器端指定的Repository。存储的所有文件这个 Checkout和Visual Source Safe的Checkout意义完全不一样&#xff0…

[ASP.NET MVC 小牛之路]10 - Controller 和 Action (2)

继上一篇文章之后&#xff0c;本文将介绍 Controller 和 Action 的一些较高级特性&#xff0c;包括 Controller Factory、Action Invoker 和异步 Controller 等内容。 本文目录 开篇&#xff1a;示例准备 文章开始之前&#xff0c;我们先来了解一下一个请求的发出到Action方法处…

Linux下遍历指定目录的C++实现

之前在 https://blog.csdn.net/fengbingchun/article/details/51474728 给出了在Windows遍历指定文件夹的C实现&#xff0c;这里给出在Linux下遍历目录的实现&#xff0c;Windows和Linux下的实现都是参考了OpenCV 2.x中的实现&#xff0c;OpenCV中的用法可参考https://blog.csd…

要活102年,阿里凭借的是什么?

由浅到深、由轻到重、由拥抱到创新&#xff0c;看似“风平浪静”的历史背后&#xff0c;中国互联网江湖的发展实则“波涛汹涌”。对于身处核心位置的科技巨头阿里巴巴而言&#xff0c;将如何更好地去实现“希望活 102 年”的愿景&#xff1f;凭借的究竟又是什么&#xff1f;作者…

Go基础知识学习(6) 接口

2019独角兽企业重金招聘Python工程师标准>>> Golang接口定义使用interface来声明&#xff0c;它相对于其他语言最大的特定就是接口定义和实现的关联性仅仅依赖接口的名字和声明&#xff0c;无需显式声明。 接口定义和实现 在下面这个例子中&#xff0c;定义了两个自…

多模态数据+知识图谱,这次你的疑难杂症有解了!

数据是AI的基础&#xff0c;不同行业领域的数据来源广泛、形式多样&#xff0c;其每一种来源或形式都可以看作是一种模态&#xff0c;例如视频、图片、语音以及工业场景下的传感数据&#xff0c;红外、声谱等。多模态数据的语义理解与知识表示让智能体能更深入地感知、理解真实…

Linux下通过gettimeofday函数获取程序段执行时间

在Linux下计算某个程序段执行的时间一般使用gettimeofday函数&#xff0c;此函数的声明在sys/time.h文件中。此函数接收两个结构体参数&#xff0c;分别为timeval、timezone.两个结构体的声明如下&#xff1a;struct timeval {time_t tv_sec; /* seconds */long tv_usec; /* mi…

matlab练习程序(Log Polar变换)

Log Polar就是所谓的极坐标变换&#xff0c;通过变换能将笛卡尔坐标系中的图像映射到极坐标系中。 确切的来说我这里不算是Log Polar&#xff0c;因为Log Polar是将图像从&#xff08;x,y&#xff09;映射到(log(r),theta)&#xff0c;而我是将图像从&#xff08;x,y&#xff0…

SiteMapPath基本用法

1、添加一个网站地图项 Web.sitemap项 2、在 Web.sitemap项的写法如下&#xff1a; <?xml version"1.0" encoding"utf-8"?><siteMap xmlns"http://schemas.microsoft.com/AspNet/SiteMap-File-1.0"><siteMapNode url"defa…

closurescallbacks

引用文章原文地址&#xff1a;&#xff08;声明&#xff1a;文章只为自己总结知识&#xff0c;内容东拼西凑&#xff0c;版权归以下作者所有。&#xff09; 1. Wikipedia: callback(computer science) 2. Implement callback routines in Java By John D. Mitchell, JavaWorld.…

吴恩达老师深度学习视频课笔记:卷积神经网络

计算机视觉&#xff1a;包括图像分类(image classification)、目标检测(object detection)、风格迁移(neural style transfer)等等。边缘检测示例&#xff1a;神经网络的前几层可以检测边缘&#xff0c;然后后面几层可能检测到物体的部分&#xff0c;接下来靠后的一些层可能检测…

COCO 2019挑战赛,旷视研究院拿下三项计算机识别冠军 | ICCV 2019

出品 | AI科技大本营&#xff08;ID:rgznai100&#xff09;10月27日&#xff0c;两年一度的国际计算机视觉大会ICCV 2019&#xff08;InternationalConference on Computer Vision&#xff09;在韩国首尔开幕。作为ICCV 2019重头戏&#xff0c;COCO 是人工智能领域最具影响力的…

runners学习

runners是由salt-run命令调用的&#xff0c;一般我用的到就是jobs和manage模块。源代码是在./site-packages/salt/runners/下的。当然我们可以自定义runners。先谈谈jobs模块。包含active、lookup_jid、list_job、list_jobs、print_job五种方法。salt-run jobs.active ->返回…

Swift基础 - - 高德地图实践

高德地图开发需要自己到官网http://lbs.amap.com/console/ 注册一个ak&#xff0c;新建一个swift工程&#xff0c;然后在Info.plist中添加一个NSLocationAlwaysUsageDescription或者NSLocationWhenInUseUsageDescription。 高德地图的库以及依赖库加入到项目里面 需要的库如下…

Shell脚本示例代码

1. echo_printf_usage.sh: echo和printf的用法 #! /bin/bash# echo和printf的用法# echo是用于终端打印的基本命令.在默认情况下,echo在每次调用后会添加一个换行符 echo "hello, beijing" echo "$(pwd)" echo $(pwd) # 结果并不是希望得到的,将会输出: $…

「2019嵌入式智能国际大会」 399元超值学生票来啦,帮你豪省2600元!

2019 嵌入式智能国际大会即将来袭&#xff01;购票官网&#xff1a;https://dwz.cn/z1jHouwE物联网是继计算机、互联网和移动通信之后的又一次信息产业的革命性发展&#xff0c;在互联网和移动互联网高速发展的时代&#xff0c;几乎所有行业都有数据联网的需求。无论是国外的科…

ThinkPHP学习笔记之Model操作

2019独角兽企业重金招聘Python工程师标准>>> 1. 3种实例化model模型方法 a) new 命名空间GoodsModel(); b) D([“模型标志Goods”]) (之前版本会实例化自定义model对象&#xff0c;目前都实例化Model基类对象) i. 没有参数实例化一个Model对象、有参数也实例化一…

Ubuntu 14.04 64位上配置JDK操作步骤

1. 从 http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html 下载jdk-8u172-linux-x64.tar.gz; 2. 解压缩&#xff1a; tar -xvzf jdk-8u172-linux-x64.tar.gz 3. 创建/usr/jdk目录&#xff1a; sudo mkdir -p /usr/jdk 4. 将解压缩后的jd…

Swift语言实现代理传值

需求&#xff1a;利用代理实现反响传值&#xff08;以下例子采用点击第二个视图控制器中的按钮来改变第一个视图控制器中的Label的内容&#xff09; 一、创建RootViewController import Foundation import UIKitclass RootViewController:UIViewController,ChangeWordDelegate{…