纯JS文本在线HTML编辑器KindEditor

KindEditorhttp://www.kindsoft.net)是一款比较专业,主流,好用的在线HTML编辑器。

它除了可以将文本进行编辑、将Word中的内容复制进来外,本身还可以拖动缩放(右下角),十分好用。

纯JS文本在线HTML编辑器KindEditor

 

当然,最重要的是,它是纯JS版的,加载它十分方便:

<head>

    <script type="text/javascript" src="/jquery-1.9.1.js"></script>

    <script type="text/javascript" src="/kindeditor-4.1.6/kindeditor.js"></script>

    <script type="text/javascript" src="/kindeditor-4.1.6/lang/zh_CN.js" charset="utf-8"></script>

</head>

说明:
  1)第一段是引用了JQuery,理论上1.3.2版本以上都可以,但如果有新版本向下兼容,请替换老版本。下载

  2)第二段是在官方主页上下载的JS主体(http://www.kindsoft.net)。下载

  3)第三段是中文补丁包,为能正常显示编码,请加上:charset="utf-8"。下载

 

然后,创建editor对象:

<script type="text/javascript">

     //创建editor对象

     KindEditor.ready(function(K) {

         window.editor = K.create('#txtEditor');

     });

</script>

 用HTML控件创建KindEditor:

<textarea id="txtEditor" name="txtEditor" style="height:300px;width:100%;"></textarea>

 从JS中取值:

<script type="text/javascript">

   //获取HTML值

    var vHTML = window.editor.html();

   //获取Text值

    var vText = window.editor.text();

</script>

 

或者更简单的用服务器控件创建KindEditor:

<asp:TextBox ID="txtEditor" runat="server" TextMode="MultiLine" Width="100%" Height="300px"></asp:TextBox>

从.cs文件后台取值:

string editorValue = this.txtEditor.Text.Trim();

 

更多关于KindEditor的使用方法,请参见官网

你可能感兴趣的:(kindeditor)