CKEditor是什么

CKEidtor是一个在线富文本编辑器,可以将让用户所见即所得的获得编辑在线文本,编辑器或自动将用户编辑的文字格式转换成html代码。

方法一、在ASP.NET工程中添加CKEditor插件(不需要做上传图片操作)

1.下载插件:可以到CKEditor官方网站下载 CKEditor for ASP.NET Control.网址:http://ckeditor.com/download  解压后得到如下图

2.压缩包找到其中\bin\Release下的CKEditor.NET.dll和CKEditor.NET.pdb考到你的工程文件夹的Web/bin/文件下

3.在工程中右击Web工程添加引用(AddReference)在Browse中添加刚才靠过来的CKEditor.NET.dll文件

4.将压缩包中的_Sample的ckeditor文件夹拷贝到工程文件下。

5.在aspx网页中注册CKEditor插件:

第一种一种方式是在单个网页的顶部添加下面的语句如果要在单个网页中使用该插件则在该网页到最上面添加

<%@Register Assembly="CKEditor.NET" Namespace="CKEditor.NET" TagPrefix="CKEditor"%> 

第二种方式是在整个工程的Web.config文件的

<system.web><pages><controls>中添加<add tagPrefix="CKEditor" assembly="CKEditor.NET" namespace="CKEditor.NET"/>

6.然后在网页中需要使用到插件的地方添加

<CKEditor:CKEditorControl ID="id" BasePath="~/ckeditor" runat="server"></CKEditor:CKEditorControl>

7.效果图 下面部分是我用laber接受从CKEditor.Text获得的内容

方法二、在asp.net中添加 ckeditor 插件  与ckfinder结合做到图片上传与编辑

首先我们先看一下效果:

1.下载插件:可以到CKEditor官方网站下载 CKEditor for ASP.NET Control.网址:http://ckeditor.com/download  解压后得到如下图

2.在自己的项目先新建Lbrary文件夹跟js文件夹(js小写)并在js文件夹下在简历ckeditor和ckfinder文件夹,压缩包找到其中/bin/Debug下的CKEditor.NET.dll考到你新建的文件夹下,如后在引用中右键添加对刚才的CKEditor.NET.dll的引用

3.将压缩包中的_Sample的ckeditor文件夹下的9个文件考到js文件夹下的ckeditor里连同(部分文件如下)

5.在aspx网页中注册CKEditor插件:

第一种一种方式是在单个网页的顶部添加下面的语句如果要在单个网页中使用该插件则在该网页到最上面添加

<%@Register Assembly="CKEditor.NET" Namespace="CKEditor.NET" TagPrefix="CKEditor"%> 

第二种方式是在整个工程的Web.config文件的

<system.web><pages><controls>中添加<add tagPrefix="CKEditor" assembly="CKEditor.NET" namespace="CKEditor.NET"/>

6.然后在网页中需要使用到插件的地方添加

<CKEditor:CKEditorControl ID="id" BasePath="~/ckeditor" runat="server"></CKEditor:CKEditorControl>

7.下面来实现图片的上传,同样在官网上下载CKFinder,解压后把bin/Debug下的CKFinder.dll也考到Lbrary文件夹中并添加对其的引用

8.把ckfinder文件下的4个问价考到ckfinder文件夹里

9.修改ckeditor下的config.js文件,在其添加如下代码

var ckfinderPath = "/js";    config.filebrowserBrowseUrl = ckfinderPath + '/ckfinder/ckfinder.html';    config.filebrowserImageBrowseUrl = ckfinderPath + '/ckfinder/ckfinder.html?type=Images';    config.filebrowserFlashBrowseUrl = ckfinderPath + '/ckfinder/ckfinder.html?type=Flashs';    config.filebrowserUploadUrl = ckfinderPath + '/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&Type=Files';    config.filebrowserImageUploadUrl = ckfinderPath + '/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&Type=Images';    config.filebrowserFlashUploadUrl = ckfinderPath + '/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&Type=Flash';

10修改ckfinder下的config.ascx 文件,把return false 给为return true

大功告成,赶紧运行一下吧!

ASP.NET 文本编辑器使用(CKEditor)与上传图片的更多相关文章

  1. 关于NK3C使用富文本编辑器(CKEditor)发送HTML邮件的使用说明

     目前NK3C发送HTML邮件使用的的编辑器是CKEditor4.6版本,关于CKEditor的使用说明如下:   1.依赖JQuery1.7版本以上,在xxx.vm中<head>< ...

  2. asp.net文本编辑器FCKeditor使用方法详解

    文本编辑器的使用: 1.FCKeditor的官方网站是:http://www.fckeditor.net/download  目前最新的FCKeditor.Net_2.6.9版本. 请在此页下载:ht ...

  3. asp.net文本编辑器(FCKeditor)

    FCKeditor介绍 FCKeditor是一个功能强大支持所见即所得功能的文本编辑器,可以为用户提供微软office软件一样的在线文档编辑服务.它不需要安装任何形式的客户端,兼容绝大多数主流浏览器, ...

  4. summernote 文本编辑器使用时,选择上传图片、链接、录像时,弹出的对话框被遮挡住

    更多内容推荐微信公众号,欢迎关注: 即问题如下链接内的情况: http://bbs.csdn.net/topics/392004332 这个一般属于CSS中样式出现了问题,可以在点开的时候,F12查看 ...

  5. Django配置富文本编辑器kindeditor

    一.简介 django是一个容易快速上手的web框架,用它来创建内容驱动型的网站(比如独立博客)十分方便.遗憾的是,django并没有提供官方的富文本编辑器,而后者恰好是内容型网站后台管理中不可或缺的 ...

  6. js ui框架 My97日期控件 富文本编辑器

    My97日期控件 http://www.my97.net/dp/index.asp 富文本编辑器 http://www.kindsoft.net/demo.php 百度的magic也不错 http:/ ...

  7. JForum论坛添加UEditor文本编辑器

    在使用JForum论坛中发现论坛自带的文本编辑器不好用,不能上传图片,样式编辑也很麻烦,就想着把这个文本编辑器替换掉,我这里选用的是百度的开源富文本编辑器UEditor 替换后的效果图 替换方法如下 ...

  8. 富文本编辑器 CKeditor 配置使用+上传图片

    参考文献: 富文本编辑器 CKeditor 配置使用 CKEditor与CKFinder的配置(ASP.NET环境),老版本可以参考 CKEditor+CKFinder ASP版在本地电脑中的配置  ...

  9. bootstrap-wysihtml5 ckeditor 修改富文本编辑器可以上传图片

    bootstrap-wysihtml5 ckeditor 修改富文本编辑器可以上传图片   bootstrap-wysihtml5实际使用内核为ckeditor     故这里修改ckeditor即可 ...

随机推荐

  1. Autoit实现分割字符串,循环输出元素

    #include <MsgBoxConstants.au3> Local $aDays = StringSplit("Mon,Tues,Wed,Thur,Fri,Sat,Sun& ...

  2. 浅析hashCode方法

    一.问题引入 谈到hashCode就不得不说equals方法,二者均在Object类里,由于Object类是所有类的基类,所以一切类里都可以重写这两个方法. 要想较清晰的理解,需要先知道容器Colle ...

  3. 云存储,OWNCLOUD,真的遇到过这个需求哟。。。

  4. C#程序设计基础——变量

    变量表示数值,字符串值或类的对象.变量存储的值可能会发生更改,但名称保持不变.C#是一种强类型语言,在变量中存储值之前,必须指定变量的类型. 变量的命名规则: 1-变量只能有字母,数字和下划线三种字符 ...

  5. db file sequential read等待事件的一点研究

    db file sequential read等待事件有3个参数:file#,first block#,和block数量. 这个等待事件有3个参数P1,P2,P3, 其中P1代表Oracle要读取的文 ...

  6. 学渣上手 LaTeX 完成毕业论文

    学渣上手 LaTeX 完成毕业论文 作为一个标准的学渣,虽然经历了一系列变故但最终还是使用 LaTeX 完成了我的毕业论文.要问我感想的话,就是——如果没有做好迎接比较陡峭的学习曲线以及各种打击人的小 ...

  7. POJ3083 Children of the Candy Corn(搜索)

    题目链接. 题意: 先沿着左边的墙从 S 一直走,求到达 E 的步数. 再沿着右边的墙从 S 一直走,求到达 E 的步数. 最后求最短路. 分析: 最短路好办,关键是沿着墙走不太好想. 但只要弄懂如何 ...

  8. 自动化测试——case编写

    简单总结一下最近项目里遇到的问题和解决的方法,可能不全,因为之前做的时候太匆忙了,很多点都没有记录下来,能记得多少是多少吧.纲巴蝶! 1. 问题:犯错误,新增case后忘记把编码也写上去了,后来跑脚本 ...

  9. 快速生成apk 自动发布到网站 便于测试

    遇到的问题: 开发者生成的apk 需要不断给 测试安装让他们测试.有没有脚本自动将最新apk上传到服务器,让测试自己安装测试呢?mac电脑 怎么自己搭建文件服务器  启动Tomcat功能在这里不在赘述 ...

  10. 【4】JAVA---地址App小软件(UpdatePanel.class)(表现层)

    修改地址信息的一个表现层类. 必须选中地址,才能修改,否则会弹出窗口提示, 修改地址界面: /* * UpdatePanel.java * */ package cn.hncu.addr.ui; im ...