纯JS文本在线HTML编辑器KindEditor

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

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

当然,最重要的是,它是纯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;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的使用方法,请参见官网

原文地址:https://www.cnblogs.com/kandyvip/p/3208855.html