富文本KindEditor使用
1.官网down KindEditor,添加到自己的项目中;添加时可把不需要的文件夹干掉,asp/php等等。我的项目用的是纯html和js,直接调用后台api;

2.页面引入相关js。eclipse中打开min.js的时候可能会报错,直接忽略就可以,不影响使用。
<link rel="stylesheet" href="/kindeditor/themes/default/default.css" /> <link rel="stylesheet" href="/kindeditor/plugins/code/prettify.css" /> <script charset="utf-8" src="/kindeditor/kindeditor-all-min.js"></script> <script charset="utf-8" src="/kindeditor/lang/zh-CN.js"></script> <script charset="utf-8" src="/kindeditor/plugins/code/prettify.js"></script>
3.编辑器初始化脚本。
<script type="text/javascript"> KindEditor.ready(function(K){ K.create('textarea[name="messagecontent"]', { themeType: 'simple', resizeType: 1, allowFileManager: true, //当失去焦点时执行 this.sync(); afterBlur: function(){this.sync();} }); }); </script>
4.form表单添加文本域。
<textarea id="editor" name="messagecontent" style="width:700px;height:300px;"></textarea>
5.表单提交,如果不执行sync()函数,将无法获取到textarea的值。
function saveMsgInfo(){ if($('#msgInfoForm').form('validate')){ var formData = $("#msgInfoForm").serialize(); formData = decodeURIComponent(formData,true); console.info(formData); $("#msgInfoForm").form("submit", { url:forceRefresh('msg/info/createMsgInfo'), onSubmit: function(param){ param = formData; }, success: function(data){ } }); } }
6.文本域的清空和赋值
KindEditor.instances[0].html("");
KindEditor.instances[0].html(val);
浙公网安备 33010602011771号