HTML代码编辑器

 

<textarea id="htmlTmpelate" name="content1" cols="100" rows="8" style="width:700px;height:350px;visibility:hidden; margin: 0px;"></textarea>

官网下载所需js

http://kindeditor.net/demo.php

<!-- HTML代码编辑器 -->
<script charset="utf-8" src=".../static/html/kindeditor-all.js"></script>
<script charset="utf-8" src=".../static/html/lang/zh-CN.js"></script>
<script charset="utf-8" src=".../static/html/plugins/code/prettify.js"></script>
<script>
//KindEditor脚本   需要的功能可以根据需要添加
 var editor;
 KindEditor.ready(function(K) {
        editor = K.create('#htmlTmpelate', {
        items: ["source", "|", "undo", "redo", "|", "preview", "print", "template", "code", "cut","copy", "paste", "plainpaste", "wordpaste","|", "justifyleft", "justifycenter", "justifyright", "justifyfull", "insertorderedlist","insertunorderedlist", "indent", "outdent", "subscript", "superscript", "clearhtml","quickformat", "selectall", "|", "fullscreen", "/", "formatblock", "fontname", "fontsize", "|","forecolor", "hilitecolor", "bold", "italic", "underline", "strikethrough", "lineheight","removeformat", "|", "image", "multiimage", "flash", "media", "insertfile", "table", "hr","emoticons", "baidumap", "pagebreak", "anchor", "link", "unlink", "|", "about"]
        });
    });


function getHtmlTmpelate() {
	editor.sync();
	var htmlTmpelate=$('#htmlTmpelate').val();
    console.log(htmlTmpelate);
}

</script>