初识kindEditor 及为kindEditor赋初始值

本文主要是介绍初识kindEditor 及为kindEditor赋初始值，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

在jsp页面嵌套的Iframe中使用kindEditor.（jsp结合使用LigerUi-1.2.2）


初次使用kindEditor（在线HTML编辑器），kindEditor官网：http://www.kindsoft.net/index.php


product.jsp中HTML：
<div id="kindEditorDialog" style="display: none; height: 380px;">
<iframe id="editIframe" style="height: 379px;"></iframe>
</div>
product.jsp中javascript：
 var kindEditorDialog = null;
       //主页面选择一条记录进行详情描述，打开kindEditor页面：
function f_detailDialog(){
   var select = mainGrid.getSelected();
if(!select){
LG.tip("请选择一条记录");
return;
}
f_detail_dialog(null,$("#kindEditorDialog"));
   $('#editIframe').attr('src', '${ctx}/kindeditor/editor');//动态配置路径，调用controller类中跳转kindEditor.jsp页面
 }


 //初始化详情描述编辑dialog:
function f_detail_dialog($form,$dialog){
kindEditorDialog = $.ligerDialog.open({
target : $dialog,
width :  1024,
top : 20,
title : '详情描述',
buttons : [ {
text : '确定',
onclick : function() {
f_save_detail(kindEditorDialog,$form,kindEditorForm);
}
},{
text : '取消',
onclick : function() {
kindEditorDialog.close();
}
} ]
});
}


//发送ajax同步请求，获取初始化编辑器textarea内容
function f_getText() {
var detail = null;
var select = mainGrid.getSelected();
$.ajax({
url: '${ctx}/portal/product/selByProductId/' + select.productId,
type: "POST",
dataType: "json",
async: false
}).done(function(product) {
detail = product.deatil;
});
return detail;
}




//product.jsp页面获取kindEditor信息，并保存
function f_save_detail(dialog,$form,form) {
var iframe = $("#editIframe")[0].contentWindow || $("#editIframe")[0].window;
var detail = iframe.editor.html();
var param = {};
param.detail = detail;
param.productId = mainGrid.getSelected().productId;
$.post('${ctx}/portal/product/saveDetail',param,function(msg){
if(msg){
LG.tip("保存成功.");
}else{
LG.tip("保存失败.");
}
kindEditorDialog.close();
});
}




kindEditor.jsp中HTML:
<textarea name="deatil" cols="100" rows="10" id="editor_id"
style="width: 1000; height: 200; visibility: hidden;">
</textarea>


kindEditor.jsp中javaScript:


var editor = null;
     KindEditor.ready(function(K) {
editor = K.create('textarea[name="deatil"]', {
width : '986px',
height : '370px',
langType : 'en',
desinModel : false,
filterMode : true,//true时根据 htmlTags 过滤HTML代码，false时允许输入任何代码
uploadJson : '${ctx}/kindeditor/uploadJson',//指定上传文件的服务器端程序
fileManagerJson : '${ctx}/kindeditor/fileManagerJson',//指定浏览远程图片的服务器端程序
allowFileManager : true,
fullscreenMode : false,
afterCreate : function() {//初始化编辑器结束事件
var f_getText = window.parent.f_getText;//获取父页面是否有f_getText方法
if (f_getText) {
editor.html(f_getText());//有f_getText方法，则执行f_getText方法
}
}
});
   });

这篇关于初识kindEditor 及为kindEditor赋初始值的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---