zoukankan      html  css  js  c++  java
  • CKEditor在.NET中的应用

    转自:http://shawnqiu.javaeye.com/blog/689748

    1. 下载ckeditor
    官方网址:http://ckeditor.com/
    最新版本:CKEditor 3.3.1,released on 10 June 2010

    2. 精简ckeditor
    删除_samples和_source文件夹,分别为示例文件和未压缩源程序。
    删除lang文件夹下除zh-cn.js,en.js下的所有语言文件,或根据需要删除。
    删除根目录下的changes.html(更新列表),install.html(安装指向),license.html(使用许可)
    删除skins目录下不需要的皮肤。//如果只保留V2则必须在config.js中指定皮肤

    3. ckeditor 3.0.1相关文件配置路径
    /ckeditor.js   核心文件,调用需加载
    /config.js     配置文件,参数配置均在此完成
    /plugins/smiley/images 表情符号.

    4. ckeditor配置(config.js配置文件)

    Config.js代码 复制代码
    1. config.language = "zh-cn";   
    2. config.skin = "office2003";   
    3. config.width = "100%";   
    4. config.height = "600px";   
    5. config.resize_enabled = false;   
    6. config.toolbarCanCollapse = false;   
    7. config.toolbar = [['Source''Preview''-'], ['Cut''Copy''Paste''PasteText''PasteFromWord', ], ['Undo''Redo''-''Find''Replace''-''SelectAll''RemoveFormat'], ['Image''Flash''Table''HorizontalRule''Smiley''SpecialChar''PageBreak'], '/', ['Bold''Italic''Underline''-''Subscript''Superscript'], ['NumberedList''BulletedList''-''Outdent''Indent''Blockquote'], ['JustifyLeft''JustifyCenter''JustifyRight''JustifyBlock'], ['Link''Unlink''Anchor'], '/', ['Format''Font''FontSize'], ['TextColor''BGColor'], ['Maximize''ShowBlocks''-''About']];  


    5. ckeditor内的文本自动换行
    修改contents.css,设置如下
    Css代码 复制代码
    1. body { word-break:break-all;//自动换行 }  


    6. .net环境应用ckeditor
       HEAD中引用js脚本
    Javascript代码 复制代码
    1. <script type="text/javascript" src="../ckeditor/ckeditor.js"></script>  

    将相应的控件替换成编辑器代码
    Html代码 复制代码
    1. <asp:textbox id="txt_CKEditor" runat="server" Width="100%"></asp:textbox>  
    2. <script type="text/javascript">  
    3.   var editor = CKEDITOR.replace('txt_CKEditor');   
    4. </script>  

    添加一个text控件,用于存放ckeditor的HTML源码
    Html代码 复制代码
    1. <asp:textbox id="txt_NoticeContext" runat="server" Width="1px" TextMode="MultiLine" Height="1px"></asp:textbox>  


    7. 获取ckeditor的HTML源码
    HTML页面中
    Javascript代码 复制代码
    1. <script>   
    2.   function BindContent()   
    3.   {   
    4.     document.Form1.txt_NoticeContext.value = editor.document.getBody().getHtml();   
    5.   }        
    6. </script>  

    cs页面中
    C#代码 复制代码
    1. protected void Page_Load(object sender, EventArgs e)   
    2. {   
    3.   //向按钮增加读取页面内容的js函数(点击按钮时将文章内容绑定到隐藏的文本框)   
    4.   btn_Add.Attributes.Add("onclick""javascript:BindContent();");   
    5. }  

      获取OO对象时
    C#代码 复制代码
    1. noticeInfoTemp.NoticeContext = txt_NoticeContext.Text;  


    8. 将HTML源码赋给ckeditor
    HTML页面中
    Javascript代码 复制代码
    1. <script>   
    2.   function LoadContent()   
    3.   {   
    4.     editor.setData(document.Form1.txt_NoticeContext.value);   
    5.   }            
    6. </script>   
    7. ...   
    8. <body onload="javascipt:LoadContent();">  

    cs页面中
    C#代码 复制代码
    1. txt_NoticeContext.Text = t_tw_noticeinfo.NoticeContext;  

  • 相关阅读:
    STM32 IAP程序 源码 和测试代码 有详细的中文注释
    mysql读写分离配置,利用mybatis实现,解释为什么dynamicDataSource不行
    mysql主从复制的配置总结
    Chapter 2 Open Book——7
    leetcode415---字符串大数相加
    Chapter 2 Open Book——6
    leetcode83,删除有序链表中的重复元素
    Chapter 2 Open Book——5
    Chapter 2 Open Book——4
    leetcode24,交换链表相邻的节点
  • 原文地址:https://www.cnblogs.com/wangpei/p/1965226.html
Copyright © 2011-2022 走看看