CKEditor 配置

在asp.net 中注意需要特殊处理控件的ID

先引入js

<script type="text/javascript" src="ckeditor/ckeditor.js"></script>

然后设置文本框

2、在使用编辑器的地方插入HTML控件<textarea>
<textarea id="TextArea1" cols="20" rows="2" class="ckeditor"></textarea>
如果是ASP.NET环境,也可用服务器端控件<TextBox>
<asp:TextBox ID="tbContent" runat="server" TextMode="MultiLine" class="ckeditor"></asp:TextBox>
注意在控件中加上 class="ckeditor" 。


3、将相应的控件替换成编辑器代码,需要在定义的文本框之后 或者使用 js限制在$(document).ready(function(){});中
<script type="text/javascript">
    CKEDITOR.replace('TextArea1');
    //如果是在ASP.NET环境下用的服务器端控 件<TextBox>
    CKEDITOR.replace('tbContent');

  CKEDITOR.replace('<%= tbContent.ClientID %>');//不是简单的"tbContent"

    //如 果<TextBox>控件在母版页中,要这样写
    CKEDITOR.replace('<%=tbContent.ClientID.Replace("_","$") %>');
</script>

<div><div style ="background-color:#E0F4FF; height:35px;  line-height:35px;font-family: 微软雅黑; font-size: large; color: #000000; font-weight: bold;" align="left">---- 摘要 ----</div>
    <asp:TextBox ID="i_content" runat="server" AutoPostBack="True" Height="320px" 
                        TextMode="MultiLine" Width="100%"></asp:TextBox>
                                        <script type="text/javascript">
        CKEDITOR.replace('<%= i_content.ClientID %>', {skin : 'kama',height:'320',uiColor :'#b4e6fe'}); 
</script></div>
posted @ 2016-06-03 17:10  龍☆  阅读(209)  评论(0编辑  收藏  举报