怎么使用CKEDITOR

  出于工作需求,自己在网上找了个文本编辑器控件, 网址是http://ckeditor.com/

怎么使用? 先插入脚本<script type="text/javascript" src="*/ckeditor.js"></script>,  然后,在自己的脚本里调用CKEDITOR.replace( ‘你的textArea的ID‘ )即可。 对, 使用思路就是 用开发者的ckeditor控件替代HTML的textarea。

这个是我的例子。

HTML部分:

<p>
                <span class="titleGroup">发布内容:</span>
                <span class="group-adjust"><textarea id="textAreaId"></textarea></span><span class="hint-adjust hint">发布内容不能为空</span>
     </p>

JS部分:

<!-- 文本编辑框脚本 -->
  <script type="text/javascript" src="../ref/ckeditor/ckeditor.js">
  </script>

<!-- 我的脚本 -->

<script type="text/javascript">
           window.onload = function(){
                  CKEDITOR.replace( "textAreaId");
           }
     </script>

时间: 2024-07-31 09:48:36

怎么使用CKEDITOR的相关文章

ckeditor中“浏览服务器”的后台操作

此博文,基于CKeditor 4.5.6版本测试通过. 原创博文,转载请注明出处 参考官方文档,以及网络上的一些帖子.经过调试得到正确的期待中的结果. [网络上的一些所谓的帖子,不知道是故意将上传的代码整点错误其中,还是无疑间遗漏了些什么,总之整个看是完整的程序,经过我的仔细研究和debug,存在很多KENG, 我崇尚分享的理念,既然blog出来,就要认真的对网友有所帮助] 这里,简单的贴一下ckeditor的配置: 1 CKEDITOR.editorConfig = function( con

.net core CKEditor 图片上传

最近在玩 asp.net core,不想用UEditor,想使用CKEditor.故需要图片上传功能. 废话不多说,先上效果图: CKEditor 前端代码: <text id="content" name="content"></text> <script> CKEDITOR.replace('content'); </script> CKeditor config.js 配置代码:需要配置图片上传路径 CKEDIT

ckeditor中 config.js等通过ckeditor.js引入文件手动修改方法

因为除了ckeditor.js之外的引用文件是通过ckeditor.js自动添加<script>或<link>标签实现文件的引入,引入的根目录是展示页面的地址.有时需要手动修改通过ckeditor.js引入的文件.这是需要在引入ckeditor.js之前定义window.CKEDITOR_BASEPATH = '../../static'(目录自己修改),编辑器将强制修改引用地址. ckeditor.js的这一部分源码是处理定义地址的: basePath: function() {

新版CKeditor七牛云插件修改

新版CKeditor七牛云插件修改基于,CKeditor 4.6的源码,CKeditor新版支持从word复制内容直接上传了(IE9+),所以不需要之前的imagepaste老插件了.本来打算对上传的文件名做一个修改,避免同时拖入大量文件,导致文件名相同覆盖的情况,考虑到之前使用的是:Uinx时间戳_原文件名的方式,所以默认还是不修改.很多人觉得文件名对搜索引擎排名有提权作用,其实可以说是基本没有的,所以不用纠结文件名的问题. 新版的改动 1.升级到CKeditor 4.6源码,并且保留了CKe

CKeditor七牛云JS SDK前端上传插件修改

七牛云官方有放出JS SDK,没有我想使用的CKeditor前端上传插件,所以结合七牛官方的Javascript SDK对CKeditor做了一些修改使它能够直接上传到七牛云,又同时保留了上传到本地服务的接口. 优点和缺点1.在前端上传到七牛云,不消耗服务器带宽和流量.空间.2.保留了CKeditor上传到自己服务器的能力.3.支持拖拽和剪切板黏贴图片上传(因为是保存为png格式,建议只黏贴色彩单调的图片,要不然图片会很大,浪费流量).4.拖拽和剪切板黏贴图片.不支持4M以上的文件,因为没有分块

CKEditor图片上传实现详细步骤(使用Struts 2)

本人使用的CKEditor版本是3.6.3.CKEditor配置和部署我就不多说. CKEditor的编辑器工具栏中有一项"图片域",该工具可以贴上图片地址来在文本编辑器中加入图片,但是没有图片上传. "预览"中有一大堆鸟语,看得很不爽.可以打开ckeditor/plugins/image/dialogs/image.js文件,搜索"b.config.image_previewText"就能找到这段鸟语了,(b.config.image_prev

ckeditor简单的演示

先把ckeditor文件添加到项目中 然后在页面上引用 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>ckediot编辑器的简单使用</titl

CKEditor编辑器中左下角有body和p元素,去掉的解决办法

最近项目中用到了CKEditor编辑器,可是令人头疼的是编辑器左下角有body和p元素,研究了好几天,后来终于找到了解决办法,以此记录下来: 在config.js中的CKEDITOR.editorConfig里加上config.removePlugins = 'elementspath';这句即可.

基于MVC+EasyUI的Web开发框架经验总结(5)--使用HTML编辑控件CKEditor和CKFinder

Web开发上有很多HTML的编辑控件,如CKEditor.kindeditor等等,很多都做的很好,本文主要介绍在MVC界面里面,CKEditor的配置和使用.CKEditor的前身是FCKEditor,随着它的更新,上传图片的功能被分离出去了,现在如果需要实现上传图片,要么自己写代码或者采用其他上传控件(如Uploadify),还有一种方法是使用CKFinder,这两者的合并使用,能给我们带来更多的方便. 1.CKEditor的使用 CKEditor的下载地址是http://ckeditor.

springMVC和ckeditor图片上传

1.下载ckeditor后将文件夹放在webroot的js目录下: 2.springmvc配置静态文件访问 在web.xml中添加: <servlet-mapping> <servlet-name>default</servlet-name> <url-pattern>*.css</url-pattern> </servlet-mapping> <servlet-mapping> <servlet-name>d