最新文本编辑器,FCK升级版:CKEditor.NET

CKEditor.NET.dll 版本:3.6.4.0

官方网址:http://ckeditor.com/

 

效果图:

 

 

配置web.config:

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

<system.web>

 

页面上加入标签:

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

 

在aspx页面插入控件:

<CKEditor:CKEditorControl ID="txtRemark" runat="server"  BasePath="~/UserControl/ckeditor/"  Toolbar="Source|Preview|Templates|Cut|Copy|Paste|Undo|Redo|Bold|Italic|Underline|Font|FontSize|TextColor|BGColor|Maximize" Width="388px" Height="150px" >

 

工具栏设置,如在js中加载了此控件,那设置的工具栏则无效,需在js中重新设置工具栏:

3种方式设置:

     1、在页面中设置:设置Toolbar属性 以"|"分隔每个菜单,"-"添加一个分割符,"/"添加一个换行

Toolbar="Source|Preview|Templates|Cut|Copy|Paste|Undo|Redo|Bold|Italic|Underline|Font|FontSize|TextColor|BGColor|Maximize"

   

    2、cs代码:在代码中加入(默认全部工具栏显示)

"-" 分隔符,"/" 换行符,新的new object[] 为一个分组

txtRemark.config.toolbar = new object[]

{

       new object[] { "Source", "-", "Preview", "-", "Templates" },

       new object[] { "Cut", "Copy", "Paste", "PasteText", "PasteFromWord", "-", "Print", "SpellChecker", "Scayt" },

       new object[] { "Undo", "Redo", "-", "Find", "Replace", "-", "SelectAll", "RemoveFormat" },

       new object[] { "Form", "Checkbox", "Radio", "TextField", "Textarea", "Select", "Button", "ImageButton", "HiddenField" },

       "/",

       new object[] { "Bold", "Italic", "Underline", "-", "Subscript", "Superscript" },

       new object[] { "NumberedList", "BulletedList", "-", "Outdent", "Indent"},

       new object[] { "JustifyLeft", "JustifyCenter", "JustifyRight", "JustifyBlock" },

       new object[] { "Link", "Unlink", "Anchor" },

       new object[] { "Image", "Flash", "Table", "HorizontalRule", "Smiley", "SpecialChar", "PageBreak", "Iframe" },

       "/",

       new object[] { "Styles", "Format", "Font", "FontSize" },

       new object[] { "TextColor", "BGColor" },

       new object[] { "Maximize" }

}

   3、JS中设置:调用加载编辑器控件 (若使用此方法,在页面或代码中设置的工具栏则无效,如不需js调用控件可采用第1种方法)

$(

   function ()

   {

               CKEDITOR.replace('txtRemark', {
                    toolbar : //重设工具栏
                              [

                                  ['Source', 'Preview',],
                                  ['Bold', 'Italic', 'Underline'],
                                  ['Outdent', 'Indent'],
                                  ['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock'],
                                  ['Link', 'Unlink'],
                                  '/',
                                  ['Font', 'FontSize'],
                                  ['TextColor', 'BGColor','-','Maximize']
                              ]
                }); //编辑器

    }
);

 

js取值和赋值:

赋值:CKEDITOR.instances.txtRemark.setData("值");

取值:var obj = CKEDITOR.instances.txtRemark.getData();

 

 

cs代码中获取值:

txtRemark.Text

文本编辑器 CKEditor 用法的更多相关文章

  1. MVC5富文本编辑器CKEditor配置CKFinder

    富文本编辑器CKEditor的使用 *:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: ...

  2. Django实现的博客系统中使用富文本编辑器ckeditor

    操作系统为OS X 10.9.2,Django为1.6.5. 1.下载和安装 1.1 安装 ckeditor 下载地址 https://github.com/shaunsephton/django-c ...

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

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

  4. 富文本编辑器CKEDITOR的使用配置(问题注解)

    CKEDITOR是一款非常轻便的富文本编辑器,如上图:参考网上的使用方法,我以.net为例,在aspx页面使用, 准备工作:首先要下载控件包,将解压后的整个文件夹添加到项目根目录. 第一步:引用js, ...

  5. 富文本编辑器ckeditor继承

    新建一个web项目ckfinder,导入lib包 加入java包,编码格式UTF-8 在WebRoot下添加ckedtior以及ckfinder两个文件夹,将config.xml拷入WEB-INF中 ...

  6. 富文本编辑器CKEditor的使用

    由于最近在架构一个pc端b/s结构的项目,项目中有个论坛模块,当用户发帖时,需要用到富文本编辑器,考虑了一下,决定使用CKEditor富文本编辑器,虽然现在问世的富文本编辑器很丰富,比如还有百度的UE ...

  7. 富文本编辑器 CKeditor 配置使用 (带附件)

    Ckeditor下载地址:http://ckeditor.com/download 1.CKeditor的基本配置 var textval=CKEDITOR.instances.TextArea1.g ...

  8. 富文本编辑器 CKeditor 配置使用

    作者:Tyler Ning出处:http://www.cnblogs.com/tylerdonet/本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连 ...

  9. Vim文本编辑器详细用法

    1 Vi.Vim文本编辑器 1.Vi.Vim Vi是Visual interface的简称. Vim是Vi的增强版,即Vi Improved.在后面的实例中将介绍Vim的使用. 为什么学vi? 1)所 ...

随机推荐

  1. c#接口深入一步探究其作用,适合新人了解

    前言 前一篇浅显的述说了一下c#接口的作用,并用了一个不怎么好的例子述说了一下.时隔一天,在看完大家的评论后我在论坛中查看了很多前辈们对c#接口的描述,发现大家对例子的说明不是太容易让我们这些新人理解 ...

  2. 暑假集训(1)第二弹 -----Catch the cow(Poj3278)

    Description Farmer John has been informed of the location of a fugitive cow and wants to catch her i ...

  3. VMProtect使用小计【一】

    文章列表 VMProtect使用小计[一] – 初次使用VMProtect使用小计[二] – 加壳查看VMProtect使用小计[三] – 权限管理 说明 VMProtect的功能我就不说了,详情大家 ...

  4. 【转】主从同步出现一下错误:Slave_IO_Running: Connecting

    主从同步出现一下错误: Slave_IO_Running: ConnectingSlave_SQL_Running: Yes 解决方法: 导致lave_IO_Running 为connecting 的 ...

  5. x264_param_t结构

    typedef struct x264_param_t { unsigned int cpu; // CPU 标志位 int i_threads; // 并行编码多帧; 线程数,为0则自动多线程编码 ...

  6. 关于Linux内核学习的误区以及相关书籍介绍

    http://www.hzlitai.com.cn/article/ARM9-article/system/1605.html 写给Linux内核新手-关于Linux内核学习的误区 先说句正经的:其实 ...

  7. C# DES

    using System; //这个是使用DES的基础 using System.Security.Cryptography; //这个是处理文字编码的前提 using System.Text; // ...

  8. 有反斜杠时候,CakePHP往pgsql插入数据异常

    原始数据:INSERT INTO “public”.”tables” (“table”, “columns”) VALUES (‘table1\’, ‘{“col1″:false,”col2″:tru ...

  9. 读取Android APK文件签名的方法

    在微信开放平台等申请API key 和secret时经常要用到apk文件签名,那么如何读取呢? 下面贴一下相关读取源码: 一共两个文件MainActivity和MD5, package com.lcg ...

  10. 【 java版坦克大战--事件处理】 坦克动起来了

    折腾了这么久,坦克总算能动了.只贴代码编辑不给上首页,花了半个小时的时间写了n多注释. 再顺便把绘图的原理发在这里: 绘图原理 Component类提供了两个和绘图有关的重要方法: ①   paint ...