HTML编辑控件CKEditor的使用

1.CKEditor的使用:

CKEditor的下载地址是http://ckeditor.com/download,里面可以根据需要进行样式的定制,本文主要介绍当前较新的版本4.4.1的继承使用。而CKFinder的下载地址是:http://ckfinder.com/download

CKEditor使用比较简单,在页面添加相应的js以及样式文件就可以了,不用做其他的配置,在mvc试图页面引用文件如下:

 <script src="~/Content/JQueryTools/ckeditor/ckeditor.js"></script>
    <script src="~/Content/JQueryTools/ckeditor/adapters/jquery.js"></script>

然后在页面添加textarea控件:

 <textarea  id="Content" name="Content" style="width:1024px"></textarea>

我们一般使用的时候,需要一段javascript脚本进行初始化对应的控件,初始化代码如下所示:

  <script>
        $(function(){
            $(‘#Content‘).ckeditor();//控件1
            $(‘#Content1‘).ckeditor();//控件2
    })
    </script>

界面效果如下:

给控件赋值和取值方法和其他控件相同:

$(‘#Content1‘).val(info.Content);//ckeditor赋值
var content = $("#Content1").val();//取值

HTML编辑控件CKEditor的使用,布布扣,bubuko.com

时间: 2024-10-12 16:17:46

HTML编辑控件CKEditor的使用的相关文章

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

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

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

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

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

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

分享一个Winform里面的HTML编辑控件Zeta HTML Edit Control,汉化附源码

我们知道,Web开发上有很多HTML的编辑控件,如FCKEditor.CKEditor.kindeditor等等,很多都做的很好,而虽然Winform里面有WebBrowser控件,但是默认这个控件是不允许编辑内容的,可以显示网页而已.Winform开发里面,有些使用RichTextBox控件来编辑HTML,也有一些结合WebBrowser控件来实现内容的编辑,其中我觉得做的最好的应该是Zeta HTML Edit Control(http://www.codeproject.com/Artic

VC2010编译源代码编辑控件scintilla

VC2010编译源代码编辑控件scintilla flyfish 代码编辑器notepad++使用了scintilla VS著名的插件Visual Assist X 也使用scintilla 编译方法1  命令行编译 执行 Visual Studio 命令提示 (2010) 进入控制台界面,使用CD命令进入下载的scintilla目录 scintilla\win32 执行 nmake -f scintilla.mak 参数f代表文件名称 编译方法2 进入目录scintilla\win32 直接打

winform界面开发-HTML内容编辑控件

参照及推荐博客:伍华聪 http://www.cnblogs.com/wuhuacong/archive/2009/07/07/1518346.html http://www.cnblogs.com/wuhuacong/p/3560685.html 这篇文章介绍了作者软件的开发及成长历程,作者在十几年的开发历程中注重思考.总结.归纳和整理,形成了自己的开发风格,其中很多经验之处值得我们借鉴和学习,至少使我提前意识到软件开发成长历程中除了技术的熟练程度之外更应该注重的是开发思想.开发心得及开发思路

[转载]ExtJs4 笔记(8) Ext.slider 滚轴控件、 Ext.ProgressBar 进度条控件、 Ext.Editor 编辑控件

作者:李盼(Lipan)出处:[Lipan] (http://www.cnblogs.com/lipan/)版权声明:本文的版权归作者与博客园共有.转载时须注明本文的详细链接,否则作者将保留追究其法律责任. 本篇要登场的有三个控件,分别是滚轴控件.进度条控件和编辑控件. 一.滚轴控件 Ext.slider 1.滚轴控件的定义 下面我们定义三个具有代表意义滚轴控件,分别展示滚轴横向.纵向,以及单值.多值选择的特性: [html] <h1>滚轴控件</h1> <div class

DevExpress2011控件教程)编辑控件(comboBox,AspxCheckBox) 范例1

DevExpress2011控件教程)编辑控件(comboBox,AspxCheckBox) 范例1 AspxCheckBox 是一个检查编辑控件去展示特殊条件是否关闭或者打开.它通常会展示Yes/No 或者是 True/False 的选择给用户.用户可以通过用鼠标点击编辑控件改变Check状态或者通过按 SPACE键来改变. 2011版本允许有2或3种状态. ASPxCheckBox支持2到3中状态,依赖 AllowGrayed属性设置. 用程序设置状态,一般使用Checked 或者 Chec

VCL组件之编辑控件

Note 以后将用两种方式提及组件,以组件的名称或定义组件的VCL类的名称.可以说“Label组件用于……”或说“TLabel用于……”,这两种方式谈到的是同一组件. 编辑控件(Edit Control) Delphi共有5个编辑控件组件,Edit.Memo.MaskEdit.RichEdit(该控件不是标准Windows控件)和SpinEdit(数字编辑框),在此讨论因为它与其他编辑控件有许多相同的特点. 1.Edit组件 Edit组件封装基本的单行编辑控件,这个组件没有Align和Align