l编辑器kindeditor我的使用方法

 KindEditor是一款用Javascript编写的开源在线HTML编辑器,主要用户是让用户在网站上获得可见即可得的编辑效果,开发人员可以用 KindEditor 把传统的多行文本输入框(textarea)替换为可视化的富文本输入框。你可以在其官网了解更多信息,包括演示、文档、下载等。

  KindEditor的使用方法也非常简单,下面言小鱼就简单介绍一下其用法,这些内容你可以在KindEditor官网找到。

l编辑器kindeditor我的使用方法_第1张图片

工具/原料

  • KindEditor编辑器
  • 电脑

方法/步骤





















kindeditor在asp.net中的使用,kindeditor版本3.3.1。

1.下载KindEditor最新版本。打开下载页面。

2.把kindeditor放在你的网站目录下,随意目录,只要路径设置对就可以!

3.要显示编辑器的位置添加TEXTAREA输入框。如果已经有TEXTAREA,属性里添加ID即可。 

代码
< textarea  id ="content_1"  name ="content"  style ="width:700px;height:300px;" ></ textarea >

4.在相应页面上添加kindeditor的引用,添加如下代码:

复制代码
代码
< script type = " text/javascript "  charset = " utf-8 "  src = " /editor/kindeditor.js " >< / script>
< script type = " text/javascript " >
    KE.show({
        id : 
' content_1 '   // TEXTAREA输入框的ID
    });
< / script>
复制代码

src=..... 这里根据你的kindeditor放置位置而变化。

怎么获取textarea的文本内容?
1.在 < textarea  id ="content_1"  name ="content"  style ="width:700px;height:300px;" ></ textarea >
后面添加隐藏input和button,代码如下:
代码
< input  id ="content_1_1"  type ="hidden"  runat ="server"  value =""   />
<asp:Button ID="Button1" runat="server" Text="保存" OnClientClick="save();" OnClick="Button1_Click" CssClass="i_1" />

添加事件处理代码
1.首先是客户端代码,在服务器代码之前执行,代码如下:

复制代码
代码
function  save() 
         {
             
var  s  =  KE.util.getData( " content_1 " );
             s 
=  KE.util.escape(s);
             document.getElementById(
" content_1_1 " ).value  =  s;
         }
复制代码

已经在服务器控件中取到了,保存的时候保持content_1_1的value就可以了。
2.服务器代码,代码如下:

代码
     protected   void  Button1_Click( object  sender, EventArgs e)
    {
        在这里写你要执行的服务器代码,因为已经去到值了。
    }

 以上,我想已经够详细了,不明白请留言!关于kindeditor的详细信息,请前往http://www.kindsoft.net/doc.php。
关于图片上传,请查看http://www.kindsoft.net/list.php?bbsid=7。


你可能感兴趣的:(l编辑器kindeditor我的使用方法)